2012-03-29 14 views
5

Jeśli mam następujące elementy DOMtworzenia json z elementów DOM przy użyciu jQuery

<div class="item">content1</div> 
<div class="item">content2</div> 

w jaki sposób, przy użyciu jQuery i JavaScript, mogę wybudować obiekt JSON jak poniżej?

[{ 
'classname': 'item', 
'content': 'content1' 
} 
{ 
'classname': 'item', 
'content': 'content2' 
}] 

Dowolna zalecana do czytania?

+0

Dlaczego chcesz to zrobić? Czasami najlepszą reprezentacją danych są same dane. –

+0

Rozważ przechowywanie danych w modelu MVC, a nie DOM ... –

+0

Próbuję utworzyć tabelę JSON, tak jak tutaj: http://links.sourceforge.net/timeline/js/examples/example17_json_data.html Ale zamiast bezpośrednio pisać html w obiekcie Json, chciałem napisać kod HTML w DOM i _then_ skonstruować obiekt Json. Czy to najlepszy sposób, aby o tym poradzić? – bento

Odpowiedz

6
var data = $('div.item').map(function(){ 
    return { 
     classname: 'item', 
     content: $(this).text() 
    }; 
}).get(); 

DEMO: http://jsfiddle.net/nDE7e/

+0

Nice. Jakie są zalety robienia tego w ten sposób przy użyciu .each()? – bento

+0

'.map' zwróci ci tablicę zamiast jej wcześniejszego zrobienia. –

+0

Dobrze wiedzieć. Dzięki. – bento

0

Możesz zapętlać element divs i dodawać obiekty do tablicy.

var items = new Array(); 

$("div.item").each(function() { 
    var item = {classname: this.className, content: $(this).text()}; 
    items.push(item); 
}); 
2

http://jsfiddle.net/24JjD/

var datas = [{ 
    'classname': 'item', 
    'content': 'content1' 
    }, { 
    'classname': 'item', 
    'content': 'content2' 
    } 
]; 

$.each(datas, function(key, value) { 
    $('body').append('<div class="'+value.classname+'">'+value.content+'</div>'); 
});​ 

Poprawna odpowiedź:

http://jsfiddle.net/tS9r5/

var datas = []; 

$('div.item').each(function() { 
    var data = { 
     classname: this.className, 
     content: $(this).text() 
    }; 
    datas.push(data); 
}); 

console.log(datas); 

+0

ups, zrobiłem odwrotnie. –

+0

świetnie! dzięki. Dobrze wiedzieć, jak iść w obie strony. – bento

Powiązane problemy