JavaScript: обход атрибутов элемента

Методы JavaScript DOM .getAttribute() и jquery .attr() позволяют получить только один атрибут элемента по его имени. А что делать если нам нужно обойти все заданные атрибуты элемента, чтобы, например, определить какие-то параметры, и нам не важно точное имя атрибута?

Здесь показан обход аттрибутов методом JavaScript DOM и заполнение массивов nodes и values их именами и значениями соответственно (с http://stackoverflow.com/questions/2048720/get-all-attributes-from-a-html-element-with-javascript-jquery, ответ Roland Bouman, который получил всех больше плюсов):

var nodes=[], values=[],
    el = document.getElementById('someId');
for (var attr, i = 0, attrs = el.attributes, n = attrs.length; i < n; i++){
    attr = attrs[i];
    nodes.push(attr.nodeName);
    values.push(attr.nodeValue);
}

А если мы используем jquery, можно получить атрибуты так (c http://stackoverflow.com/questions/14645806/get-all-attributes-of-an-element-using-jquery, красивый ответ pimvdb) :

$(this).each(function() {
  $.each(this.attributes, function() {
    if(this.specified) {
      // Теперь this.name - имя атрибута
      // this.value - его значение (JavaScript DOM)
    }
  });
});

Примечание: в стрых IE мы получаем все возможные атрибуты, не только те, которые представлены в элементе. Поэтому мы используем свойство specified.

Автор ответа тут же указал дополнение к jquery, добавляющее вызов метода .attr() без параметров к любому элементу, который возвращает объект со всеми атрибутами этого элемента:

(function(old) {
  $.fn.attr = function() {
    if(arguments.length === 0) {
      if(this.length === 0) {
        return null;
      }
 
      var obj = {};
      $.each(this[0].attributes, function() {
        if(this.specified) {
          obj[this.name] = this.value;
        }
      });
      return obj;
    }
 
    return old.apply(this, arguments);
  };
})($.fn.attr);
 
// Использование:
var $div = $("<div data-a='1' id='b'>");
$div.attr();  // { "data-a": "1", "id": "b" }

Красиво, да? Автору ответа – большой плюс.

Правда сам на практике я ещё не проверял эти методы (кроме первого, он прекрасно работает).

До встречи, друзья, отличного настроения, крепкого сна и чистого неба над головой!