Javascript 表单中的命名元素如何干扰全局名称空间？

有这个代码吗

<script>
function faul() { alert("faul"); }
</script>

<form>
  <button onclick="faul()">action</button>
  <input name="faul" required>
</form>

函数faul（）{alert（“faul”）；}
行动

单击该按钮会导致

faul不是一个函数

，但当该按钮位于表单之外或被称为

onclick=“window.faul（）”

时，会调用该函数

---

请解释冲突。

如果在单击处理程序中执行

console.log（faul）

，您将看到

faul

是对同名输入的全局引用

原因是由于历史原因，（如果不是全部的话，大多数）浏览器通过使任何具有name属性的元素作为该名称的引用而污染了form元素的内联事件处理程序的运行范围。顺便说一句，对于任何具有id属性的元素也是如此，但是在全局范围内（如下所示）

使用

addEventListener（）

而不是内联属性添加处理程序可以避免此问题（如下所示）

document.querySelector（'form button'）。addEventListener（'click'，function（）{
log（'来自addEventListener处理程序：'，faul）；
});

函数faul（）{alert（“faul”）；}
伐木场
原木faul2
这是一个古老的怪癖，即用于将表单元素名称添加到全局对象，而今天其他浏览器也这样做，因此
我不同意“复制”，因为在本例中，它明确涉及
名称
属性，而不是
id
属性，全局作用域与窗体作用域之间存在差异。@adaneo在我的Chrome中，当我调用
window.faul（）
时，函数被调用，而只调用
faul（）
会导致错误，因为它被命名元素隐藏。另外，由于链接的问题是关于ID属性和这个关于NAME属性的，并且行为几乎相同，但不完全相同，请您取消复制该标志。我想问，但由于仓促关闭，我无法得到答案：（仍然让我困惑的是，从内联处理程序中，如果按钮在表单之外，它正确地调用了faul函数。您是否可以解释一下为什么通过
window.faul（）调用
有效？我知道
formElement.faul
access，但它与全局名称有何冲突？命名元素仅在表单范围内可用，这就是为什么当按钮位于外部时，它引用具有相同名称的函数的全局引用，显式调用
window.faul
（在浏览器上下文中，
窗口
也是全局范围）。