我记得以前学的时候,只要在全局声明了变量,function 内也能用,可这里为什么出错呢?
正常情况:
<script>
function addTextNode(text)
{
var newtext = document.createTextNode(text);
var p1 = document.getElementById("p1"); //这句为什么不能定义在外面!!
p1.appendChild(newtext);
}
</script>
<body>
<button onclick="addTextNode('WE CAN!');">WE CAN!</button>
<hr/>
<p id="p1">First line of paragraph.</p>
</body>错误情况:
<script>
var p1 = document.getElementById("p1"); //这句为什么不能定义在外面!!
function addTextNode(text)
{
var newtext = document.createTextNode(text);
p1.appendChild(newtext);
}
</script>
<body>
<button onclick="addTextNode('WE CAN!');">WE CAN!</button>
<hr/>
<p id="p1">First line of paragraph.</p>
</body>加载顺序问题
楼上的几位都说的很清楚啦，放在外面的前提要加一个 window.onload=function(){.....}，因为DOM还没有ready，此时不存在P1这个节点。
写在函数里面只有被点击的时候才会执行这个函数，此时DOM已经ready了，所以可以获取到P1这个节点
楼上正解，如果你要在文档头部写script你要用window.onload事件。
在执行<script>的时候，文档还没有载入完，<p id="p1">在下面，还没被载入，所以此处var p1获取不到东西。如果把这段script放到<p id="p1">的下面，就能正常工作。
执行脚本的时候dom树还没渲染，找不到那个id
放在外面的话，那一句是在script是在文档加载之前就要执行的，所以此时是找不到p的，把script放在body后面就不会报错了
js加载是顺序加载，注意这点会少犯很多错误 ~