给定这些JavaScript变量：
var div_id = "my_div"; var h1_class = "my_header"; var a_class = "my_a_class"; var a_string = "teststring";
和这个页面元素：
<div id="container"></div>
我想用jQuery构建这个html结构：
<div id="container">
<div id="my_div">
<h1 class="my_header">
<a href="/test/" class="my_a_class">teststring</a>
</h1>
</div>
</div>
在这里连接命令的最好和最可读的方法是什么？
解决方法
更新
- DEMO: 07000
JSON
var widgets = [{
"div" : {
"id" : "my-div-1"
},"h1" : {
"class" : "my-header"
},"a" : {
"class" : "my-a-class","text" : "google","href" : "http://www.google.com"
}
},{
"div" : {
"id" : "my-div-2"
},"text" : "yahoo","href" : "http://www.yahoo.com"
}
}];
$(function() {
$.each(widgets,function(i,item) {
$('<div>').attr('id',item.div.id).html(
$('<h1>').attr('class',item.h1.class).html(
$('<a>').attr({
'href' : item.a.href,'class' : item.a.class
}).text(item.a.text))).appendTo('#container');
});
});
