Question

<body>
  <span someAttribute="xyz">.....</span>
  ...
  <div>
    ...
    <span someAttribute="abc">.....</span>
    ...
    <div someAttribute="pqr">.....</div>
    ...
  </div>
</body>

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

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

注意：我想在不使用jquery的情况下执行此操作。

Answer 1

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

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"));
   }
}

Answer 2

在新版浏览器中，您可以这样做：

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

Answer 3

您可以遍历DOM树的所有元素。

Answer 4

您可以使用document.body.getElementsByTagName("div")按标签名称选择元素，以获取文档中的所有div元素。此函数返回一个元素数组，您可以解析这些元素并过滤掉与您的条件不匹配的元素。

Answer 5

你可以使用

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

但这也会返回html，head和body ......

然后对所有元素进行循环并查找属性。

Answer 6

我找到了一个名为getElementsByAttribute(doc, tagArray, attribute, attributeValue)

的代码段

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

希望这可以提供帮助。

Javascript通过其属性获取元素

6 个答案: