全局和本地JavaScript范围

Question

为什么在此函数中无法识别全局变量？

<script type="text/javascript">
var id_f = document.getElementById('f');

function foo()
{
id_f.innerHTML=("text");
}
</script>

Answer 1

如果找不到匹配的元素，则.getElementById()函数会返回null，这不是错误，但如果您的id_f变量为null，则它不具备.innerHTML属性，会出错。

即使页面源中存在匹配元素，除非在实际解析了元素之后运行脚本，否则将无法找到该元素。因此，您的脚本需要位于源代码中的元素之后（例如，在结束</body>标记之前），或者您需要添加onload或document.ready类型处理程序并从那里运行代码。

（如果您将console.log(id_f)或alert(id_f)添加到函数的开头，会得到什么？）