#javascript #jquery #dom #dom-traversal
#javascript #jquery #dom #dom-обход
Вопрос:
Я хочу просмотреть DOM и определить HTML-атрибуты определенных узлов. Например, значение класса для всех тегов.
Следующий код был предложен другим участником Stackoverflow для обхода DOM: http://jsfiddle.net/FJeaY /
Это работает хорошо, и я могу использовать его для идентификации идентификатора узла и его родителей. Также довольно легко фильтровать гиперссылки:
walk_the_DOM(document.body, function(node) {
if(node.nodeName == "A")
alert(node.nodeName ' id: ' node.id);
});
Однако я не уверен, что использовать для идентификации класса (или любого другого атрибута HTML). Все, что я пробовал до сих пор, начиная с поиска документации jQuery, завершилось неудачей.
Любые идеи приветствуются, заранее благодарю вас.
Комментарии:
1. вы пробовали
node.className
?
Ответ №1:
Рассматриваемая функция на самом деле вообще не использует jQuery, а документация jQuery не подходит для изучения DOM в целом.
Взгляните на ссылку HTMLElement
MDC. То, что вам нужно, это className
атрибут:
walk_the_DOM(document.body, function(node) {
if(node.nodeName == "A") {
alert(node.nodeName ' class: ' node.className);
}
});
Комментарии:
1. Отлично. Спасибо за ссылку на справочник Felix. Вы абсолютно правы, базовый код, который у меня был, не был jQuery. То, что я планирую делать с каждым узлом, будет связано с jQuery, и мне удалось запутаться.
2. @Tama: Ну, если вы все равно планируете использовать jQuery, то вы могли бы просто сделать:
$('a').each(function(){/* do you stuff here */)
. Вероятно, это будет быстрее, поскольку jQuery использует методы браузера, если они доступны.
Ответ №2:
.hasClass()
может использоваться для проверки, есть ли определенный класс среди классов, назначенных элементу. Вернет либо true, либо false.
$(node).hasClass('myclass')
Или вы можете использовать .attr()
для получения class
атрибута элемента.
var klassz=$(node).attr('class');
Вместо последнего вы можете просто использовать node.className
любой.
Ответ №3:
Оформить заказ http://jsfiddle.net/tahir/7gfuT /
Этот код использует DOM напрямую (просто для пояснения концепций). Вы можете использовать функции-оболочки jquery, предложенные bazmegakapa, чтобы упростить доступ к атрибутам DOM
Комментарии:
1. Спасибо, Тахир, тоже очень полезно.
2. Добро пожаловать. Щелчок по маленькому треугольнику, помимо ответа, указывающего вверх, — это еще один способ поблагодарить StackOverflow 😉