New course! Every coder should learn Generative AI!
Try a free lesson+ 7
Can someone point out the error in this code
I don't know why getting error in this code someone help me (btw I think its very small error) *HTML CODE* <span id="page2"> <h1><div id="rocktxt2">Rock</div><div id="papertxt2">Paper</div><div id="scissorstxt2">Scissors</div>THE GAME!</h1> </span> *CSS CODE* #rocktxt2{ color: #A8A8A8; } #papertxt2 { color: #dcdcdc; } #scissorstxt2 { color: red; } *javascriptcode* var page2 = document.getElementById("page2").style.display = "none";
18 Answers
+ 10
....Doesn't relate to window.onload....
It's
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<span id="page2">
<h1><div id="rocktxt2">Rock</div><div id="papertxt2">Paper</div><div id="scissorstxt2">Scissors</div>THE GAME!</h1>
</span>
<script>
var page2 = document.getElementById("page2").style.display = "none";
</script>
</body>
</html>
The problem
is
SL auto include <script> in <head> tag
While we need
to include <script> in <body> tag
You know what to do right?
+ 10
@Calvin
😊 Yep window.onload Help a lot
Bc
<head> activate the javascript while element isn't loaded the page finished yet
But window.onload....after loaded finished now. => activate the function inside window.onload
+ 5
still the error persists :-( help!
+ 5
no wait its not what u think it is
+ 5
I want to make them disappear and am getting this error
Unable to get property 'style' of undefined or null reference
Line: 10
+ 5
Even I think so
+ 5
@ Calvin putting it in window onload makes this part of code work but the bigger part dosent function
+ 5
idk without onload function my code runs perfect but I decided to edit it since then I an receiving this error
+ 5
alright guys if alright try putting window onload in my code rock paper scissor s
+ 5
here's the link
https://code.sololearn.com/W3Z7Z31b53sz/?ref=app
+ 2
window.onload = function(){
// put your js code here.
}
+ 2
Your code is correct. There is a bug in Sololearn Playground. Refer to this JSFiffle link.
https://jsfiddle.net/3nkschL3/
Note
If you comment js codes. You will see that js was making span invisible.
+ 1
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<span id="page2">
<h1><div id="rocktxt2">Rock</div><div id="papertxt2">Paper</div><div id="scissorstxt2">Scissors</div>THE GAME!</h1>
</span>
<style>
#rocktxt2{
color: #A8A8A8;
}
#papertxt2 {
color: #dcdcdc;
}
#scissorstxt2 {
color: red;
}
</style>
<script>
var page2 = document.getElementById("page2").style.display = "BLOCK";
</script>
</body>
</html>
+ 1
Change javascript code style display from "none" to "block"
+ 1
Hi @Ani Naslyan
Jsfiddle already set the js code to onload type by default, whereas SL code playground, we have to set it by ourself.
This is not a bug on SL code playground.
+ 1
Whenever you use document object, you have to set it inside window.onload, this function make sure that your elements are loaded before setting your element variables.
+ 1
@Very
You are right, when we put js code together with html, got to include script tag.
But if the js code in js column, we have to put the code inside window.onload, whenever declare element variables.
Many beginners make this mistake due to not familiar with SL code playground structure.
Often have questions like this?
Learn more efficiently, for free:
Hot today
Strange narrowing conversion error from FLTK Color to Color Struct, Stroustrup's header Graph.h
0 Votes
Can anyone help me with this?
0 Votes
Python Question
3 Votes
While loop with input dont work
1 Votes
How to learn fast C?
0 Votes
Python frameworks problem
0 Votes
Coder or Programmers
2 Votes