Преобразование пар атрибутов/значений элемента DOM в объект Javascript?

Question

Есть ли функция быстрого доступа, которая преобразует элемент DOM и его различные пары атрибут/значение в соответствующий объект Javascript?

Например, преобразовать это в странице HTML:

<div id="snack" type="apple" color="red" size="large" quantity=3></div> 

к объекту в Javascript, как если бы вы ввели:

var obj = { 
     id: "snack" 
     type: "apple" 
     color: "red" 
     size: "large" 
     quantity: 3 
}; 

Answer 1

Не совсем ярлык, но по крайней мере, короткая реализация, которая делает что вы хотите:

var attributes = document.getElementById('someId').attributes; 
var obj = {}; 

for (var i = 0, len = attributes.length; i < len; i++) { 
    obj[attributes[i].name] = attributes[i].value; 
} 

Answer 2

Почему бы не использовать данные HTML и JQuery?

// First, append the attributes with `data-`. 
<div id="snack" data-type="apple" data-color="red" 
    data-size="large" data-quantity="3"></div> 


// Then use jQuery to retrive the data, for this case, 
// the `snack` variable is populated 
var snack = $("#snack").data(); 

for(prop in snack) { 
    alert(prop + " => " + snack[prop]); 
} 

sample code

Я не уверен, что если вы разрешили использовать JQuery

Answer 3

В более функциональном стиле, один оператор:

[].slice.call(attributes).reduce(function(obj,attr){obj[attr.name] = attr.value;return obj;},{})