我花了很长时间弄清楚我不应该将clear()用作Javascript中的函数名称:
<head> <script type="text/javascript" src="Array.js"></script> </head> <body> Hello!!!!<br> <button type="button" onClick="clear()" id="ppp">Shoo!</button><br> <button type="button" onClick="add()" id="add">Add a few elements</button><br> <button type="button" onClick="check()" id="check">Check the array</button><br> <p id="results">Results will appear here.</p> <script type="text/javascript"> initialize(); </script> </body>
这是Array.js:
var results; function initialize(){ results = document.getElementById("results"); } function add() { results.firstChild.data="add"; } function clear() { results.firstChild.data = "Hello?"; } function check() { results.firstChild.data = "check"; }
症状:单击“添加”和“检查”按钮可得到预期的结果,但是单击“清除”按钮则无济于事。
如果我将 clear() 重命名为 clearxyz() ,它可以正常工作。
我的问题:
非常感谢。编辑:我正在使用Firefox 6.0,并且添加了一个换行符以显示Array.js的起始位置。
正如有人说,clear是 不是 保留关键字。似乎被调用的函数是document.clearMDN。调用中
clear
document.clear
console.log(clear === document.clear);
在事件处理程序内部返回true。
true
看来,document它位于事件处理程序的作用域链中。…现在的问题是为什么。
document
JavaScript:权威指南说:
在作为HTML属性的事件处理程序中,Document对象在范围链中,在Window对象之前(…)
因为您的方法是全局的,这意味着它是window对象的一个属性,所以在作用域链中找不到它,就像document.clear在作用域链中前面提到的那样。
window
我还没有找到任何规范。该指南还指出,不应依赖于此,因此我认为这并不是官方的内容。
如果您在表单中包含表单元素,那么即使是相应的form元素也将在范围链中(尽管不确定是否适用于所有浏览器)。这是造成混乱的另一个原因。
form
有两种(非排他性的)方法可以避免这种情况:
不要使用内联事件处理程序。 由于它是混合逻辑和表示形式,因此被认为是不好的做法。还有其他的方式附加事件处理程序。
不要污染全局名称空间。 在创建全球范围内一个对象(一个名字你肯定不会有任何碰撞window或document属性或HTML元素的IDS)和分配功能,因为这对象的属性。每当调用函数时,都通过此对象引用它。还有其他方法可以对代码命名空间。