为什么在删除之前检查元素/属性？

Question

在Learning Javascript - A Hands-On Guide to the Fundamentals of Modern Javascript的Working with the Attribute Node一章中，作者Tim Wright在第73页说：

删除一个属性就像获取一个属性一样简单。我们只是定位元素节点并使用方法removeAttribute() 将其从那里取出。 如果您尝试删除不存在的属性，则不会引发 Javascript 异常，但最好还是使用我们之前提到的 hasAttribute() 方法，如清单 4.6.4 所示

清单 4.6.4 用于删除我们图像的类值的 Javascript

if(document.getElementById("pic").hasAttribute("class")) {
    document.getElementById("pic").removeAttribute("class");
}

如果两种方式都没有抛出异常，是不是检查它是否存在是多余的？也会出现同样的结果。书中所说的论点是在删除参数之前检查参数可以节省浏览器通过不必要的代码解析，但if(document.getElementById("pic").hasAttribute("class")) {} 本身甚至比document.getElementById("pic").removeAttribute("class"); 更长！

为什么这是最佳做法？

Answer 1

在我看来，你的假设是绝对正确的。我认为书中的“建议”有点灾难性（使用一个戏剧性的术语）。以前从未听说过这种“最佳实践”。在删除/更改属性之前使用element.hasAttribute 绝对无法实现任何目标，但会减慢代码速度。浏览器没有神奇的属性查找列表来检查它们在设置或获取属性时未使用的存在。不过，在作者看来，可能是生成可读和可理解代码的最佳实践。

此外，在我看来，您根本不应该使用setAttribute！只有使用setAttribute 才能获取或设置某个属性没有内置的标准方法。这里class有问题，使用

element.className = 'myclass';

而不是

element.setAttribute('class', 'myclass');

浏览器在使用此类标准化方法时已优化了例程。如果在为元素分配或删除属性时没有使用，那么浏览器必须弄清楚它是什么类型的属性，并且可能会在之后触发特殊操作 - 不是每次都需要。

您可以检查浏览器是否支持这样的特定属性方法

if (typeof window.document.body.className === 'string') {
   //className is supported for node elements
}

大多数属性方法的行为类似于 getter 和 setter。您可以读写，并且使用其中一些甚至比其他方法更有效。示例：

element.outerHTML = '';

清理更多的内存比

element = null;

这当然不是元素的属性，而是说明为什么人们应该更喜欢使用针对元素特定部分的内置方法。

有很多很多标准方法，如element.className，您可以使用它来定位特定的标准属性。它们大多被命名为驼峰表示法中的属性名称。将setAttribute 仅用于您自己的自定义属性，例如

element.setAttribute('data-my-custum-attribute', 'hello');

根据 HTML5 标准，这是完全合法的标记。如果浏览器不支持某个属性方法，或者将其用作后备。这可能是非常旧的浏览器的情况。但是连IE6都支持className。

---

我会推荐两本我认为对于深入理解 javascript 非常有价值的书（不是说我完全做到了，但这些书对我帮助很大）：

Javascript - the good parts，Douglas Crockford
Secrets of the JavaScript Ninja，John Resig（jQuery 背后的人）

买书！它们是您办公桌上的黄金参考。

Answer 2

我想到的一件事是 removeAttribute 可能是一个更繁重的函数调用，关于它所做的操作，即它修改 DOM 和 HTML，并且还可能影响浏览器。

相比之下，hasAttribute 只是一个读操作，它轻量很多，不会对元数据产生影响。所以最好检查元素是否有属性。

如果 removeAttribute 本身已经进行了 hasAttribute 检查，那么我同意它几乎是多余的。

Answer 3

当你编写一个大型程序或在一个小组中工作时它很有用......你需要检查你没有删除某些东西/其他人正在使用的东西。如果有更技术性的答案，希望其他人会提供它。