为什么Chrome浏览器上的id =“pattern”时嵌入的'OnClick'不起作用？

这可能很简单，我忽略了，但是我的google-fu没有提供任何可以解释原因的东西。就拿下面的片段（忽略现在嵌入式JS通常被认为是不好的做法）：为什么Chrome浏览器上的id =“pattern”时嵌入的'OnClick'不起作用？

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> 
    <title> 
    </title> 
</head> 
<body> 
    <form action=""> 
     <div> 
     <input type="text" id="pattern" value="foobar"> 
     <input type="button" value="Alert" OnClick="alert(pattern.value);"> 
     </div> 
    </form> 
</body> 
</html>

以上将在IE8和Firefox 3打印警告消息“foobar的”，但Chrome浏览器将打印“未定义”。将pattern更改为pattern_之类的其他内容将按预期方式为所有三种浏览器打印“foobar”。

是pattern保留字，或者使用内建的JS库的一个名字吗？ Chrome浏览器无法正常工作的原因是什么？

来源

2011-06-15 greatwolf

有趣怪癖，... – Tomalak 2011-06-15 07:36:34

由于内部所提到的浏览器连接DOM元素作为对象全局命名空间（window）。所以，用id="xyz"对象也可以作为window.xyz或者甚至xyz解决。我想Chrome不会这样做。

还要检查my SO-question这一点，尤其是所选择的答案。

[编辑]后评论：这是Chrome浏览器（WebKit的）确实是相关的，它可能有一些做什么，我发现here。又见quirksmode（搜索页面的“模式”，它看起来像在HTML5 pattern是input的属性，所以我可以想像，与具有相同名称的ID干扰）

来源

2011-06-15 07:32:51 KooiInc

，将无法解释的事实是改变ID的工作 – Locksfree 2011-06-15 07:37:41

确定，不够公平，我只是以后有什么维克多T.说下去。 Thx – Locksfree 2011-06-15 07:50:55

是的，有趣的，我找不到任何关于这一点。尽管如此，我认为使用全局变量是不可取的，比如他的代码中显示的OP。 – KooiInc 2011-06-15 07:55:08

不要使用全局变量访问DOM元素通过id。有document.getElementById(...)为此目的，甚至更好 - 在几乎任何JS库/框架的选择器功能（例如，在jQuery的$('#yourid')，$('yourid')在原型，等等）。它们保证您可以跨浏览器支持，而全局浏览器可能会有所不同。

来源

2011-06-15 07:39:12 mkilmanas

+1的建议。当然我会在实际页面中使用'getElement（s）*'方法。虽然我仍然对我在试验时碰到的这个怪癖感到好奇。 – greatwolf 2011-06-15 08:14:02

为什么Chrome浏览器上的id =“pattern”时嵌入的'OnClick'不起作用？

回答

相关问题