javascript - Javascript 的 getElementById 的使用

Question

在 yui 库的示例代码中，我看到了这个符号：

var obj = document.getElementById("coffee_msg");
obj.style.display = 'block';

由于 obj 只使用一次，我宁愿这样：

document.getElementById("coffee_msg").style.display = 'block';

在 yui 库和许多其他地方使用第一个符号有什么原因吗？是否与某些浏览器不兼容？

Answer 1

没有“真正的”原因，只是为了使代码更具可读性。

就像：

var myAge = 26;
var myAgeNextYear = myAge + 1;

对比：

var myAgeNextYear = 26 + 1;

我个人的偏好是仅在我多次使用 obj 时才保留对它的引用。

Answer 2

如果您只需要设置一个属性，则根本没有关系（只要您不想在尝试访问它的属性之前检查返回值是否有效）。

但是，如果您有多个属性，您将只想进行一次查找（即使 id 查找非常快），因此将元素分配给变量是这种情况下的方法。

当然，您可以使用 jQuery 将其缩短：$('#coffee_msg').show()
如果元素由于某种原因不存在，您也不会收到错误消息。如果你想设置多个 CSS 属性等，你可以简单地使用一个函数来为你做这件事，一个调用或链接多个调用到不同的 jQuery 方法。

Answer 3

这两种不同的方式工作方式完全相同。使用临时obj变量可能有助于提高代码的可读性（但应该给它一个比obj这种情况更好的名称）。

Answer 4

第一个选项很有用，因为它提高了可读性，它还使 obj 变量可以立即用于其他用途。我会亲自使用这个例子。