В JavaScript доступны методы, позволяющие получить элементы HTML, используя их идентификатор, класс и тег.
document.getElementByID(*id*);
document.getElementsByClassName(*class*);
document.getElementsByTagName(*tag*);
Существует ли какой-либо метод для получения элементов в соответствии с именем атрибута.
EX:
<span property="v:name">Basil Grilled Tomatoes and Onions</span>
Как
document.getElementsByAttributeName("property");
Да, rthe функция querySelectorAll (или querySelector для одного элемента), что позволяет использовать CSS селекторы, чтобы найти элементы.
document.querySelectorAll('[property]'); // All with attribute named "property"
document.querySelectorAll('[property=value]'); // All with "property" set to "value" exactly.
(Полный список селекторов атрибутов в MDN.)
Это находит все элементы со свойством атрибута. Было бы лучше указать имя тега, если это возможно:
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, справятся с этим за вас; вероятно, это хорошая идея, чтобы позволить им делать тяжелую работу.
Обратите внимание, что querySelectorAll был введен в IE8 и полностью поддерживается в IE9. Все современные браузеры поддерживают это.
В jQuery это так:
$("span['property'=v:name]"); // for selecting your span element
Еще один ответ
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'
)
Я думаю, что вы хотите взглянуть на 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;
}
Вы можете получить атрибут с помощью javascript,
element.getAttribute(attributeName);
Пример:
var wrap = document.getElementById("wrap");
var myattr = wrap.getAttribute("title");
См:
С prototypejs:
$$('span[property=v.name]');
или
document.body.select('span[property=v.name]');
Оба возвращают массив