javascript 为什么这个简单的代码不能运行？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18187620/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Why won't this simple code run?
提问by Samir
<html>
<head>
</head>
<body>
<script>
function toD(angle) {
return angle * (180 / Math.PI);
}
var a = document.getElementById('test').innerHTML = toD(15);
</script>
<p id='test'> </p>
</body>
</html>
Sorry, i'm not sure if i'm missing something, but how come this code isn't running? thank you in advance, sorry if this is a stupid question!
抱歉，我不确定我是否遗漏了什么，但是为什么这段代码没有运行？在此先感谢您，对不起，如果这是一个愚蠢的问题！
回答by bizzehdee
At the time of running var a = document.getElementById('test').innerHTML = toD(15);in your script <p id='test'> </p>does not exist.
在var a = document.getElementById('test').innerHTML = toD(15);你的脚本运行时<p id='test'> </p>不存在。
place the script AFTER <p id='test'> </p>or wrap the entire script in its own function and assign it to onloadso that it is only ran after <p id='test'> </p>and the rest of the DOM is available.
将脚本放在 AFTER 之后<p id='test'> </p>或将整个脚本包装在它自己的函数中并将其分配给它，onload以便它只在之后运行<p id='test'> </p>并且 DOM 的其余部分可用。
Either
任何一个
<html>
<head>
</head>
<body>
<p id='test'> </p>
<script>
function toD(angle) {
return angle * (180 / Math.PI);
}
var a = document.getElementById('test').innerHTML = toD(15);
</script>
</body>
</html>
OR
或者
<html>
<head>
</head>
<body>
<script>
window.onload = function() {
function toD(angle) {
return angle * (180 / Math.PI);
}
var a = document.getElementById('test').innerHTML = toD(15);
}
</script>
<p id='test'> </p>
</body>
</html>
Note: this is a very dirty way of using window.onload, that should only be used if this is to be the only script on the page that requires onload. For more information about using onloadproperly when there will be multiple scripts using it, please read How to Use window.onloadthe Right Way
注意：这是一种非常肮脏的使用方式，window.onload只有当这是页面上唯一需要onload. 有关使用的详细信息onload适当的时候会有使用它是多个脚本，请参阅如何使用window.onload的正确方法
回答by adrift
You need to wait until the document loads, as you're trying to access an element (#test) before the HTML has been fully parsed by the browser - you can use window.onloadso that your JS is run after the document has been loaded - e.g.
您需要等到文档加载，因为您试图#test在浏览器完全解析 HTML 之前访问元素 ( ) - 您可以使用window.onload以便在文档加载后运行您的 JS - 例如
window.onload =
// JS
回答by epascarello
Look at the JavaScript console [f12] and you will see an error message:
查看 JavaScript 控制台 [f12]，您将看到一条错误消息：
Uncaught TypeError: Cannot set property 'innerHTML' of null
未捕获的类型错误：无法设置 null 的属性“innerHTML”
The error occurs because you are referencing the element before it is rendered to the page.
发生错误是因为您在将元素呈现到页面之前引用了该元素。
Put the script tag after the element so it can find the element.
将脚本标记放在元素之后，以便它可以找到该元素。
<html>
<head>
</head>
<body>
<p id='test'> </p>
<script>
function toD(angle) {
return angle * (180 / Math.PI);
}
var a = document.getElementById('test').innerHTML = toD(15);
</script>
</body>
</html>
回答by DontVoteMeDown
Because when you run document.getElementById('test')the DOM object <p id='test'> </p>wasn't rendered yet.
因为当你运行时document.getElementById('test')，DOM 对象<p id='test'> </p>还没有被渲染。
回答by Jim
Place the script at the bottom of the page to avoid problems like this noted above, also use windows.onload http://www.w3schools.com/jsref/event_onload.asp- to ensure the element is rendered before you cast on it.
将脚本放在页面底部以避免上面提到的问题，也使用 windows.onload http://www.w3schools.com/jsref/event_onload.asp- 以确保在您投射之前呈现元素。
回答by Butani Vijay
Problem in rendering Change your code as below :
呈现问题 更改您的代码如下：
<html>
<body>
<p id='test'> </p>
<script language="javascript">
function toD(angle) {
return angle * (180 / Math.PI);
}
var a = document.getElementById('test').innerHTML = toD(15);
</script>
</body>
</html>
-> Please read about how web page is parse. you will clear your idea about where to write script in your page.
-> 请阅读有关如何解析网页的信息。您将清除在页面中编写脚本的位置的想法。
->object should be rendered before performing operation on it. in your code div is not rendered and you try to perform operation on it ( i.e. document.getElementById('test').innerHTML = toD(15); )
-> 对象应该在对其执行操作之前呈现。在您的代码 div 中未呈现，您尝试对其执行操作（即 document.getElementById('test').innerHTML = toD(15); ）
