Перебор атрибутов элемента с помощью jQuery

Я знаю, что отдельные атрибуты могут быть получены с attr() метод, но я пытаюсь перебрать все атрибуты для элемента. Для контекста я использую jQuery на некоторых XML...

<items>
  <item id="id123" name="Fizz" value="Buzz" type="xyz">
    <subitem name="foo">
    <subitem name="bar">
  </item>
  <item id="id456" name="Bizz" value="Bazz" type="abc">
    <subitem name="meh">
    <subitem name="hem">
  </item>
</items>

Я уже могу перебирать пункты с...

$(xml).find('item').each(function() {
  // Do something to each item here...
});

Но я хотел бы иметь возможность получить массив атрибутов для каждого "элемента", чтобы я мог затем перебрать эти...

например

$(xml).find('item').each(function() {
  var attributes = $(this).attributes(); // returns an array of attributes?
  for (attribute in attributes) {
    // Do something with each attribute...
  }
});

Я провел поиск здесь, в документации по jQuery и в других местах через Google, но мне не повезло. Если ничего другого, у меня могут быть проблемы с исключением результатов, связанных с attr() метод объекта jQuery. Заранее спасибо.

Источник

8 ответов

Решение

Лучший способ - использовать объект узла напрямую, используя его attributes имущество. Единственная разница в моем решении ниже по сравнению с другими, предлагающими этот метод, состоит в том, что я бы использовал .each снова вместо традиционного цикла js:

$(xml).find('item').each(function() {
  $.each(this.attributes, function(i, attrib){
     var name = attrib.name;
     var value = attrib.value;
     // do your magic :-)
  });
});
Источник

Кажется, вы должны использовать старый добрый ванильный JavaScript:

for (var i = 0; i < elem.attributes.length; i++) {
    var attrib = elem.attributes[i];
    if (attrib.specified == true) {
        console.log(attrib.name + " = " + attrib.value);
    }
}

Как перебрать все атрибуты в элементе HTML?

Источник

Не могли бы вы получить элемент DOM из оболочки jQuery с помощью функции get(), а затем перебрать атрибуты DOM?

var node = $(myStuff).get(0);
if (node.attributes.length) {

    for (var length = attrs.length, i = 0; i < length; i++) {
        if (attrs[i].specified) {

        }
    }
}

Для более надежной обработки атрибутов DOM, проверьте этот пост в блоге.

Источник

Я публикую здесь, потому что я думаю, что это может помочь другим, которые пришли к этой публикации, желая разобрать файл XML, как я.

Я искал метод обхода XML-файла с очень похожей структурой на файл theracoonbear и сохранения результатов в массиве, и наткнулся на эту публикацию.

Я посмотрел на код Prodigitalson, но просто не смог заставить этот синтаксис работать - Firefox жаловался на следующее:

 $.each(this.attributes, function(i, attrib){

тот

this.attributes

не является определенной функцией. Я совершенно уверен, что ошибка полностью моя. Но я потратил несколько часов, пытаясь заставить это работать, и потерпел неудачу

Что сработало для меня (где мое имя тега сессия вместо элемента):-

$(xml_Data).find("session").each(function() {
    console.log("found session");
    $(this).children().each(function(){
     console.log("found child " + this.tagName);
     console.log("attributes" + $(this).text());
    });
});

Я ценю, что это может не совсем ответить на оригинальный вопрос. Однако я надеюсь, что это может спасти других посетителей этого поста через некоторое время.

С уважением

Источник

Пока вы можете просто использовать стандартный атрибут DOM Element attributes, он будет включать все атрибуты (даже те, которые явно не установлены) в IE6. В качестве альтернативы вы можете ограничить количество установленных вами атрибутов:

var use_attributes = ['id','name','value','type'];
$(xml).find('item').each(function() {
  var $item = $(this);

  $.each( use_attributes, function(){
    if($item.attr( this )){
      // Act on the attribute here. 
      // `this` = attribute name
      // $item.attr( this ) = attribute value
    }
  })
});
Источник

Как насчет?

$(xml).find('item').each(function() {
  var attributes = $(this)[0].attributes;
  for (attribute in attributes) {
    // Do something with each attribute...
  }
});
Источник 
function findByAll(toLookFor, lookInText) { 
    return $('*').filter(function() { 
        return Array.prototype.some.call(this.attributes, function(attr) {
            return attr.value.indexOf(toLookFor) >= 0; 
        }) || (lookInText && $(this).text().indexOf(toLookFor) >= 0); 
    }); 
}
Источник

Pure JS Во-первых, ваш входной XML-файл недопустим, но вы можете исправить это, закрыв теги подпунктов: /

let items = (new DOMParser()).parseFromString(xml,"text/xml").querySelectorAll('item');

items .forEach( (item,i)=> Object.values(item.attributes).forEach(a => {
  // your code
  console.log(`Item ${i}. attr ${a.name} = ${a.value}`)
}));


let xml=`<items>
  <item id="id123" name="Fizz" value="Buzz" type="xyz">
    <subitem name="foo" />
    <subitem name="bar" />
  </item>
  <item id="id456" name="Bizz" value="Bazz" type="abc">
    <subitem name="meh" />
    <subitem name="hem" />
  </item>
</items>`;

let items  = (new DOMParser()).parseFromString(xml,"text/xml").querySelectorAll('item');

items .forEach( (item,i)=> Object.values(item.attributes).forEach(a => {
  // your code
  console.log(`Item ${i}. attr ${a.name} = ${a.value}`)
}));

Источник
Другие вопросы по тегам