javascript - 按属性/属性查找元素

Question

鉴于以下

  ...
     <tr xyz="Alpha"> ... </tr>
     <tr xyz="Bravo"> ... </tr>
     <tr xyz="Delta"> ... </tr>
  ...

如何在 JScript 中获取具有 xyz = "Bravo"的行， 除了创建一个 getElementsByTagName() 循环之外， 并为它测试每个返回的元素？

xyz 是属性还是特性？

Answer 1

没有 xyz 不是有效的属性，但 HTML5 中引入的数据属性是有效的。

您可以像这样使用它们:

     <tr data-xyz="Alpha"> ... </tr>
     <tr data-xyz="Bravo"> ... </tr>
     <tr data-xyz="Delta"> ... </tr>

然后您可以使用 .querySelector() 来查找特定元素。

document.querySelector('[data-xyz="Bravo"]');

如果你想只搜索 tr，那么这样做:

document.querySelector('tr[data-xyz="Bravo"]');