Тестирование всех узлов элементов в DOM на наличие атрибутов - PullRequest
Новая
       38

Тестирование всех узлов элементов в DOM на наличие атрибутов

1 голос
/ 10 ноября 2011

Я пытаюсь найти, содержит ли какой-либо из тегов на странице атрибут события js, например onload, onunload, onfocus и т. Д., ... Для этого у меня есть массив событий для проверки (я думаю, у меня есть все): 

var attr = [
"onLoad",
"onunload",
"onclick",
"ondblclick",
"onmousedown",
"onmouseup",
"onmouseover",
"onmousemove",
"onmouseout",
"onfocus",
"onblur",
"onkeypress",
"onkeydown",
"onkeyup",
"onsubmit",
"onreset",
"onselect",
"onchange"];

и затем я получаю все elementsByTagName и хочу проверить их атрибут: 

var getAttrs = function() {
var i = 0,
    j,
    all = document.getElementsByTagName('*'),
    max = all.length,
    eventsLen = attr.length;


for (; i < max; i++) {

    console.log('iterating through objects');

    for (j = 0; j < eventsLen; j++) {

       if (all[i].hasAttribute(attr[j])) {
          console.log('found an instance of an intrinsec event', attr[j]);
       }

    }

}

};

Это не работает, и я не получаю никаких атрибутов, которые хотел найти.

Кроме того, я хотел бы найти все атрибуты во всех тегах, которые используют javascript: (например, в ) Есть идеи, как я могу добавить это в логику функции?

Спасибо!

Ответы [ 3 ]

1 голос
/ 10 ноября 2011

Если вы хотите получить все элементы, имеющие любой атрибут, можно использовать следующий код: 

var attr = ["onLoad", "onunload", "onclick", "ondblclick", "onmousedown",
            "onmouseup", "onmouseover", "onmousemove", "onmouseout", "onfocus",
            "onblur", "onkeypress", "onkeydown", "onkeyup", "onsubmit", "onreset",
            "onselect", "onchange", "href^='javascript:'"];
var selector = "[" + attr.join("],[") + "]";
//selector looks like "[onLoad][onunload]...[href^='javascript:']"
var eitherAttribute = document.querySelectorAll(selector);
for(var i=0, len=eitherAttribute.length; i<len; i++){
    console.log(eitherAttribute[i]); //Logs the element
}

Если вы хотите выбрать все элементы, которые соответствуют нескольким атрибутам, используйте: 

//Example: onclick, AND href starting with javascript:
document.querySelectorAll("[onclick][href^='javascript:']");

Для получения дополнительной информации см. MDN: document.querySelectorAll.
Если вам нужны более гибкие селекторы, взгляните на: MDN: селекторы

0 голосов
/ 10 ноября 2011

Вот как я это сделаю: 

var checkForEventAttrs = (function () {
    var eventAttrs = [ /* a list of attribute name strings */ ];

    function walkTheDOM( node, func ) {
          func( node );
          node = node.firstElementChild;
          while ( node ) {
              walkTheDOM( node, func );
              node = node.nextElementSibling;
          }
     }

    return function () {
        walkTheDOM( document.body, function ( node ) {
            eventAttrs.forEach( function ( eventAttr ) {
                if ( node.hasAttribute( eventAttr ) ) {
                    console.log( 'The attribute ' + eventAttr + ' found.' );
                }
            });
        });
    };
})();

, а затем просто вызовите эту функцию для регистрации этих атрибутов в консоли: 

checkForEventAttrs();

Live demo: http://jsfiddle.net/F5AEy/

0 голосов
/ 10 ноября 2011

Изменение: 

if (all[i].hasAttribute(attr[j])) {

Кому: 

if (all[i][attr[j]]) {

Поскольку это также может быть свойство, а не атрибут.

...