March 25, 20233 yr Hello, I have just begun learning JS at W3 Schools. At the Introduction(https://www.w3schools.com/js/js_intro.asp), it is stated that JS is insensitive to the use of either single- or double quotes. The Introduction states these two lines are the same: document.getElementById("demo").innerHTML = "Hello JavaScript"; And: document.getElementById('demo').innerHTML = 'Hello JavaScript'; The first uses double quotes and the second singe quotes. However, the exercise for changing the src of an image reveals a quote-sensitivity: <button onclick="document.getElementById('myImage').src='https://www.w3schools.com/js/pic_bulbon.gif' ">On</button> <img id="myImage" src="https://www.w3schools.com/js/pic_bulboff.gif" /> <button onclick="document.getElementById('myImage').src='https://www.w3schools.com/js/pic_bulboff.gif' ">Off</button> Here, getElementById('myImage') uses single quotes. This functions properly when ran; please see JSfiddle for example: https://jsfiddle.net/d6kac84f/ However, in the following code I use double quotes to enclose myImage, yielding an apparent syntax error: <!DOCTYPE html> <html> <body> <button onclick="document.getElementById("myImage").src='https://www.w3schools.com/js/pic_bulbon.gif' ">On</button> <img id="myImage" src="https://www.w3schools.com/js/pic_bulboff.gif" /> <button onclick="document.getElementById("myImage").src='https://www.w3schools.com/js/pic_bulboff.gif' ">Off</button> </body> </html> See JSfiddle: https://jsfiddle.net/x42o7sgp/ The JSfiddle console states the following (as a neophyte to me yet unintelligible): Quote "<a class='gotoLine' href='#39:129'>39:129</a> Uncaught SyntaxError: Unexpected end of input" "<a class='gotoLine' href='#41:130'>41:130</a> Uncaught SyntaxError: Unexpected end of input" This is strange, because the above two codes use singe- and double quotes without yielding a syntax error: document.getElementById("demo").innerHTML = "Hello JavaScript"; document.getElementById('demo').innerHTML = 'Hello JavaScript'; It is as if the sensitivity suddenly lies within the parenthesis: <button onclick="document.getElementById('myImage').src='https://www.w3schools.com/js/pic_bulbon.gif' ">On</button> (This one works) <button onclick="document.getElementById("myImage").src='https://www.w3schools.com/js/pic_bulbon.gif' ">On</button> (This one doesn't work) Thank you, should you be willing to point me in the right direction. Architect Edited March 25, 20233 yr by Architect
Create an account or sign in to comment