Question

JavaScript中有一些方法可以使用ID，Class和Tag来获取HTML元素。

document.getElementByID(*id*);
document.getElementsByClassName(*class*);
document.getElementsByTagName(*tag*);

是否有任何方法可根据属性名称获取元素。

EX：

<span property="v:name">Basil Grilled Tomatoes and Onions</span>

像：

document.getElementsByAttributeName("property");

Answer 1

是的，但并非在所有浏览器中都存在。旧版本的Internet Explorer（即版本8之前）不支持它。该函数为querySelectorAll（或单个元素的querySelector），允许您使用CSS选择器查找元素。

document.querySelectorAll('[property]'); // All with attribute named "property"
document.querySelectorAll('[property=value]'); // All with "property" set to "value" exactly.

(Complete list of attribute selectors on MDN.)

这将查找具有attribute属性的所有元素。如果可能的话，最好指定标签名称：

document.querySelectorAll('span[property]');

如果需要，您可以通过循环浏览页面上的所有元素来查看它们是否具有属性集：

var withProperty = [],
    els = document.getElementsByTagName('span'), // or '*' for all types of element
    i = 0;

for (i = 0; i < els.length; i++) {
    if (els[i].hasAttribute('property')) {
        withProperty.push(els[i]);
    }
}

像jQuery这样的库可以为你处理这个问题：让他们做繁重的工作可能是个好主意。

Answer 2

在jQuery中就是这样：

$("span['property'=v:name]"); // for selecting your span element

Answer 3

只是另一个答案

Array.prototype.filter.call(
    document.getElementsByTagName('span'),
    function(el) {return el.getAttribute('property') == 'v.name';}
);

将来

Array.prototype.filter.call(
    document.getElementsByTagName('span'),
    (el) => el.getAttribute('property') == 'v.name'
)

Answer 4

您可以使用char *a = (char *)&x;：

querySelectorAll

Answer 5

我想你想看一下jQuery，因为Javascript库提供了许多你可能想要在这种情况下使用的功能。在你的情况下，你可以写一个（或在互联网上找到一个）hasAttribute方法，就像这样（未经测试）：

$.fn.hasAttribute = function(tagName, attrName){
  var result = [];
  $.each($(tagName), function(index, value) { 
     var attr = $(this).attr(attrName); 
     if (typeof attr !== 'undefined' && attr !== false)
        result.push($(this));
  });
  return result;
}

Answer 6

您可以使用javascript获取属性，

element.getAttribute(attributeName);

例如：

var wrap = document.getElementById("wrap");
var myattr = wrap.getAttribute("title");

参见：

https://developer.mozilla.org/en/DOM/element.getAttribute

Answer 7

使用 prototypejs ：

 $$('span[property=v.name]');

或

document.body.select('span[property=v.name]');

两者都会返回数组

通过属性名称获取HTML元素

7 个答案: