通过属性获取元素

Javascript to get elements by their attributes

本文关键字：元素 获取 属性      更新时间：2023-09-26
<body>
  <span someAttribute="xyz">.....</span>
  ...
  <div>
    ...
    <span someAttribute="abc">.....</span>
    ...
    <div someAttribute="pqr">.....</div>
    ...
  </div>
</body>

这是一个示例html页面。我需要通过其属性选择html元素，我可以通过getAttribute()获得属性值，但我需要首先选择所有元素。

如何在javascript中获得属性名称为"someAttribute"的元素。一旦我得到了元素，我就可以得到属性值并使用我的函数。

注意:我想这样做，不使用jquery

在新的浏览器中，你可以这样做:

var el = document.querySelector('[someAttribute="someValue"]');

将每个元素存储在数组中，循环遍历每个元素，如果元素包含someAttribute属性，则执行操作。

var arr_elms = [];
arr_elms = document.body.getElementsByTagName("*");
var elms_len = arr_elms.length;
for (var i = 0; i < elms_len; i++) {
  if(arr_elms[i].getAttribute("someAttribute") != null){  
   alert("FOUND : " + arr_elms[i].getAttribute("someAttribute"));
   }
}

您可以使用document.body.getElementsByTagName("div")通过标记名称选择元素来获取文档中的所有div元素。这个函数返回一个元素数组，您可以解析并过滤掉不符合条件的元素。

可以遍历DOM树的所有元素

可以使用

var all = document.getElementsByTagName('*');

，但这也返回html, head和body…

，然后循环遍历所有元素并查找属性

我找到了一个名为getElementsByAttribute(doc, tagArray, attribute, attributeValue)的代码片段

你可以尝试一下工作小提琴:http://jsfiddle.net/Yx7EU/

相关文章：