Question

我有一个有趣的问题，我认为我已经掌握了它的根源，但我想确定。我有一个调用名为remove（）的函数的链接。除Chrome以外的所有浏览器都没有该功能的问题。但是，点击的链接在Chrome中消失了，即使我简化了下面示例中的功能。我看到了这个问题：Can't use "download" as a function name in javascript。但是，在链接中，我没有看到任何关于“删除”作为保留关键字的内容。我的问题是，我是关于这个关键字的正确吗？如果是这样，我可以在任何地方找到Google关键字列表吗？我搜索过，并没有发现这是其他地方的问题。

<a href="javascript:void(0)" onclick="remove()">Remove</a>

使用Javascript：

function remove(){
 alert("Hi");
}

Answer 1

Chrome中的元素有一个.remove()方法，允许自行删除元素，而不必从父级中删除。

问题在于，当使用属性处理程序时，您将获得不同的范围链。该范围链包括元素本身以及document。这意味着元素的所有属性和document都显示为变量。

因为您将函数命名为remove()，并且因为它是一个全局函数/变量，所以它被元素本身上的.remove属性（现在变量）所遮蔽。这可以通过警报看到。如果您将处理程序更改为：

onclick="alert(remove)"

......你会得到类似的东西：

function remove() { [native code] }

所以它不是保留的，而是它被用作最终影响全球的属性。

要修复它，请直接使用全局：

onclick="window.remove()"

或更改功能名称。

Answer 2

我使用铬没有问题，不是这样的

<a href="#" id="remove">Remove</a>

function remove() {
    alert("Hi");
}

document.getElementById("remove").addEventListener("click", remove, false);

on jsfiddle

内联javascript被认为是不好的做法。

如果您有更多使用相同功能的元素，只需添加更多行，例如

document.getElementById("remove1").addEventListener("click", remove, false);
document.getElementById("remove2").addEventListener("click", remove, false);
document.getElementById("remove3").addEventListener("click", remove, false);
document.getElementById("remove4").addEventListener("click", remove, false);

或者你可以得到一个节点列表并循环遍历

var nodelist = document.querySelectorAll("[id^=remove]");

Array.prototype.forEach.call(nodelist, function (element) {
    element.addEventListener("click", remove, false);
}

您可以查看另一个answer here on SO以了解有关事件绑定方法之间差异的更多信息，还可以对该主题进行一点G搜索，这将为您提供更多信息。当然，您可以通过这种方式避免遇到的问题。

Answer 3

我找不到任何关于它的文档，但Chrome中的DOM元素有一个本机方法remove，显然会删除它们。在onclick中，this实际上是指元素本身，因此它最终调用this.remove()来删除元素。要解决此问题，您只需拨打window.remove()即可。

http://jsfiddle.net/3YkZH/1/

最好通过addEventListener使用标准事件绑定，在简单地调用remove时没有这个问题：

http://jsfiddle.net/3YkZH/2/

在Google Chrome中“删除”保留的关键字？

3 个答案: