我花了很长时间搞清楚我不应该使用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的启动位置.
Fel*_*ing 35
正如有人说,clear是不是保留关键字.似乎被调用的函数是document.clear [MDN].调用
console.log(clear === document.clear);
在事件处理程序内部返回true.
所以看来,document是在事件处理程序的范围链中......现在的问题是为什么.
在作为HTML属性的事件处理程序中,Document对象位于Window对象(...)之前的作用域链中
由于您的方法是全局的,意味着它是window对象的属性,因此在范围链中找不到它,就像document.clear在范围链中更早出现的那样.
我没有找到任何规范.该指南还说,不应该依赖于此,所以我认为这不是官方的.
如果表单中有表单元素,那么即使相应的form元素也会在作用域链中(不确定这是否适用于所有浏览器).这是混淆的另一个原因.
有两种(非排他性)方法可以避免这种情况:
不要污染全局命名空间.在全局范围内创建一个对象(您确定的名称不会与任何window或documentHTML元素的属性或ID 冲突)并将这些函数指定为此对象的属性.无论何时调用函数,都可以通过此对象引用它.还有其他方法可以命名代码.
不，clear不是保留关键字。
问题是，由于您使用事件处理程序内容属性，因此您的全局函数window.clear被过时的document.clear.
此行为在获取事件处理程序的当前值的步骤 10中进行了解释：
词汇环境范围
如果H是元素的事件处理程序，则令Scope为 NewObjectEnvironment（文档，全局环境）的结果。
如果表单所有者不为空，则令Scope为 NewObjectEnvironment(表单所有者,范围)的结果。
如果element不为 null，则令Scope为 NewObjectEnvironment( element, Scope )的结果。
注意： NewObjectEnvironment() 在 ECMAScript 第 5 版第 10.2.2.3 节 NewObjectEnvironment (O, E)中定义
这意味着全局范围被
因此，您可以
重命名您的函数。
function clear__() { document.body.style.background = 'green'; }<button type="button" onclick="clear__()">Click me</button>这种方法并不完全可靠，因为某些浏览器可能会实现隐藏变量的非标准功能。或者未来的规范可能会引入该功能（示例）。
将您的函数作为全局对象的方法调用。
例如，假设window没有阴影，您可以使用window.clear.
function clear() { document.body.style.background = 'green'; }<button type="button" onclick="window.clear()">Click me</button>避免事件处理程序内容属性。
相反，您可以使用事件处理程序 IDL 属性或事件侦听器。
function clear() { document.body.style.background = 'green'; }
document.querySelector('button').onclick = clear;<button type="button">Click me</button>function clear() { document.body.style.background = 'green'; }
document.querySelector('button').addEventListener('click', clear);<button type="button">Click me</button>| 归档时间： |
|
| 查看次数： |
12434 次 |
| 最近记录： |