+ 2
why is this js statement showing error??
6 Answers
+ 2
Code we type in js tab on sololearn is loaded before html, so your elements don't exist jet, thats why we can't select them.
Solution is to wait html page to load and then run js code, you can use code Jayakrishnađźđł posted to do this.
If you have more selectors use next syntax
onload = () => {
// your js code
}
+ 3
onload= ()=> document.querySelector("button").style.backgroundColor="yellow";
+ 3
It's in Sololearn loading issue.
First if it loads JS file , then it may show html file ("button" ) element not found so returns null. So solution is to fetch elements onload with js file.
+ 3
Jayakrishnađźđł and PanicS
Thanks for the answers. Much appreciated đ
+ 1
PanicS
But on an iPad my code works but not on mobile phone
0
<!DOCTYPE html> <html lang="en" > <head> <meta charset="utf-8"> <title>Drum Kit</title> <link href="https://fonts.googleapis.com/css?family=Arvo" rel="stylesheet"> <style> .set{ text-align:center; } .drum{ font-family: 'Arvo', serif; font-size:25px ; margin: 20px; padding: 10px; border-radius: 10px; border: 2px solid #ffa000; background-color: #ffa000; color: #ffffff; box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.75); transition: all 0.3s; } .drum:hover{ background-color: #ffffff; color: #ffa000; box-shadow: 0px 0px 5px 0px rgba(