Konwersja data- * atrybuty do obiektu

Question

Mam zabawy z atrybutami attr-data-* z HTML5 i odpowiedniego javascript dataset

robię dużo dynamicznego przetwarzania formularzy, więc w końcu się rzeczy tak:

<input data-feaux="bar" data-fizz="buzz"/> 

Od HTMLElement.dataset zwraca DOM string map, jedynym sposobem mogę dowiedzieć się, jak przekształcić go w natywnej przedmiotu jest:

var obj = JSON.parse(JSON.stringify(input_el.dataset)) 

Czy jest lepszy sposób to zrobić?

Edit:

Dlaczego miałbym to zrobić? Załóżmy, że mam wiele, wiele z tych elementów. Chcę pętli przez nich wszystkich i odsyła je do tablicy w celu przetworzenia później, tj

elements = document.querySelectorAll("input") 
my_data_array = [] 
for(var i = 0; i < elements.length; i++) { 
    my_data_array.push(elements[i].dataset) 
} 

Teraz mam tablicę obiektów, tj [{feaux: "bar", fizz:"buzz"}....] że mogę pracować.

Jednak, kiedy nie przekształcić DOM string map do obiektu, tablica nie uzyskać zaludnionych (tj powyższy kod nie działa)

Edycja 2

Patrząc bliżej, w rzeczywistości jest to DOM string map, a nie object. Poprawianie literówek w oryginalnym pytaniu, aby to odzwierciedlić.

Answer 1

Można użyć Object.assign

Object.assign({}, element.dataset) 

Dla przeglądarek, które nie robi 't obsługa Object.assign można użyć polyfill

Answer 2

Oto mały Funkcja do pobierania zestawu danych elementu jako normalnego obiektu:

function datasetToObject(elem){ 
    var data = {}; 
    [].forEach.call(elem.attributes, function(attr) { 
     if (/^data-/.test(attr.name)) { 
      var camelCaseName = attr.name.substr(5).replace(/-(.)/g, function ($0, $1) { 
       return $1.toUpperCase(); 
      }); 
      data[camelCaseName] = attr.value; 
     } 
    }); 
    return data; 
} 

zgarnął od: Get list of data-* attributes using javascript/jQuery

Answer 3

Nie zapomnij o JSON.stringify i JSON.parse.

var data = document.getElementById('someElement').dataset; 
data = JSON.parse(JSON.stringify(data)); 

Według Mozilla to powinno działać przez całą drogę powrotną do IE 8 bez PolyFill.