Element.getAttributeNames与Element.attributes

Question

我想知道使用Element.getAttributeNames而不是使用Element.attributes访问Element DOM对象的属性有什么优点和缺点（如果有）。

MDN的Element.getAttributeNames提到它是Element.attributes的更高性能替代品，但没有提及任何缺点（浏览器兼容性等）

Answer 1

Element.attributes得到更广泛的支持；它已在Chrome 26（2013年初）中实现，并在IE11上受支持。相反，getAttributeNames是最近的版本：Chrome 61（2017年中），不支持IE。 （在其他浏览器中实现的时间是相似的。）

另一个区别是getAttributeNames返回一个数组，这很方便，因为您可以在其上使用数组方法，例如

elm.getAttributeNames().forEach((name) => {
  // do something
});

相对于

Array.prototype.forEach.call(
  elm.attributes,
  (name) => {
   // do something
  }
);

（或传播.attributes：[...elm.attributes]，尽管这需要创建一个额外的中间数组）

还请注意，.attributes返回一个包含两个节点名称和节点值的类似数组的对象，而getAttributeNames数组仅包含节点名称。 / p>

要在旧版浏览器中使用getAttributeNames，请确保包含polyfill。