javascript - Chrome 中的 DOM 访问

Question

我在使用 Chrome 时注意到这两个函数的工作原理是相同的:

<img src="picture.jpg" id="myelement" />

function stuff(){
var x=document.getElementById("myelement");
x.style.display="none";
}//works almost everywhere

function stuff(){
myelement.style.display="none";
}//only works in Chrome

为什么 Chrome 允许我直接从 ID 访问元素而不使用“getElementById”？这样做是不好的做法吗？这会影响性能吗？

谢谢

Answer 1

Chrome 会自动创建与每个具有 id 的元素相对应的全局变量。在生产代码中使用这些变量是一个非常糟糕的主意，因为 javascript 中没有静态变量 - 有人可能稍后将其他内容分配给 myelement你无从得知。

如果您确实使用此功能(大概是在测试环境中，例如控制台)，我猜它比 getElementById() 更快，作为分配 myelement 的代码无论哪种方式，都先运行到相应的节点。