为什么document.getElementById()函数存在？

Question

在创建网页时,我总是使用功能

var someVariable = document.getElementById('myID');

获取对元素对象的引用.最近有人向我建议这不是必要的,因为已经存在这样的变量.它的名字等于id.我测试过它似乎有效.

<div id="myID">some text</div>
<a href="someplace" onclick="alert(myID.innerHTML)">click here</a>

此代码有效,它会按预期警告"某些文本".firefox错误控制台中只有一个警告:

全局范围内由ID/NAME引用的元素.使用WC3标准document.getElementById()代替....

我现在大部分时间都在使用jQuery,但我需要向工作中的老板证明一点,否则我将不得不给他买一盒巧克力:-).

任何想法为什么上层代码不起作用或为什么使用它是一个非常错误的想法(在Firefox中警告是不够的)???

谢谢你的回答

Answer 1

任何想法为什么上层代码不起作用或为什么使用它是一个非常错误的想法(在Firefox中警告是不够的)???

因为它是非标准的(但不是很长).虽然有些浏览器会为全局变量分配带有ID的元素,但是他们没有义务这样做(并不是所有的都这样做).例如,旧版本的Firefox不会出现此行为.还存在命名冲突的风险.

在获取元素句柄时document.getElementById(),使用可确保所有浏览器的行为完全相同(嗯,或多或少咳嗽).

有关更多信息,请参阅bobince对类似问题的出色答案.

Answer 2

全局范围内由ID/NAME引用的元素.使用WC3标准document.getElementById()代替....

您当前的调用将导致可能的变量冲突.

想象一下:

<script>
    var myID = 'foo'; 
</script>
<div id="myID">some text</div>
<a href="someplace" onclick="alert(myID.innerHTML)">click here</a>

myID现在不是你的HTML元素,而是一个包含'foo'的变量.例.

您应该始终使用document.getElementById(),因为它是为特定函数构建的,用于检索HTML元素而不是JavaScript变量.