getElementById在IE下混淆name与id

About the author

Roger Johansson is a Swedish web professional specialising in web standards, accessibility, and usability.

原文点我 因为对我有用所以弄了过来,以下为大猫同学的不负责任翻译

 

贼.悅汗孙同学遇到了个问题,急得头皮屑直掉,后来买了瓶海飞丝,头屑去无踪…他觉得有必要强调一下这个头屑的问题

这个问题是:
当你在用getElementById去获取对应id的元素属性的时候,WIN下的IE(或某些版本的Opera)会不负责任的获取与id相同值的name对应的元素.

虽然不大可能你用同一个值命名不同元素的id和name,但一旦产生错误,会让你欲仙欲死

下面是实例:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta name="description" content="A brief description of the content on this page.">
<title>The name and id attributes in IE</title>
</head>
<body>
<div id="description">
<p>A description of something.</p>
</div>
</body>
</html>

OK,现在意淫一下你想要用JavaScript去非礼一下div#description.

简单的来说,比如说你想要在页面加载的时候把div#description的display属性设置为none:

function hideIt() {
var obj = document.getElementById('description');
obj.style.display = 'none';
}
window.onload = hideIt;

在IE里非礼一番后姑娘却一点反应都没有,原来是因为在IE里getElementById去找位于div元素之前name为description的meta元素去了

避免头皮屑你可以有两条路可以走

1.保证没有不同的元素身上有相同值得name和id

2.用一段script搞定>overriding IE’s native getElementById method

如果你已经意识到这问题,当我没说,如果还没,我希望你会很high.

发布者:bigCat

在XX季节不会乱飚尿,不会对同性及异性无情殴打,不会撕咬哭喊强烈要求夜间出门寻欢,无视异性哀号勾引,温柔敦厚寡言少语质保刚建文武两道的和谐社会型青壮年家养公猫

加入对话

12条评论

留下评论

电子邮件地址不会被公开。