JavaScript getElementByID() not working
本问题已经有最佳答案,请猛点这里访问。
为什么
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | <html> <head> <script type="text/javascript"> var refButton = document.getElementById("btnButton"); refButton.onclick = function() { alert('I am clicked!'); }; </head> <body> <form id="form1"> <input id="btnButton" type="button" value="Click me"/> </form> </body> </html> |
在您调用函数时,页面的其余部分未呈现,因此该元素不存在。 尝试在
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | <html> <head> <script type="text/javascript"> window.onload = function(){ var refButton = document.getElementById("btnButton"); refButton.onclick = function() { alert('I am clicked!'); } }; </head> <body> <form id="form1"> <input id="btnButton" type="button" value="Click me"/> </form> </body> </html> |
您需要将JavaScript放在body标记的末尾。
它没有找到它,因为它还没有在DOM中!
您也可以将它包装在onload事件处理程序中,如下所示:
1 2 3 4 5 6 | window.onload = function() { var refButton = document.getElementById( 'btnButton' ); refButton.onclick = function() { alert( 'I am clicked!' ); } } |
因为当脚本执行时,浏览器还没有解析
试试这个:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | <html> <head> <script type="text/javascript"> window.onload = (function () { var refButton = document.getElementById("btnButton"); refButton.onclick = function() { alert('Dhoor shala!'); }; }); </head> <body> <form id="form1"> <input id="btnButton" type="button" value="Click me"/> </form> </body> </html> |
请注意,您也可以使用