首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

超级着急大神,如何把这段json用js循环取生成带有链接的children子项html效果(如json数据上面)

2012-10-28 
超级着急!大神,怎么把这段json用js循环取生成带有链接的children子项html效果(如json数据下面)var yixuan_

超级着急!大神,怎么把这段json用js循环取生成带有链接的children子项html效果(如json数据下面)
var yixuan_navs = [ {
  "id" : "19",
  "name" : "\u90e8\u5c5e\u5355\u4f4d",
  "code" : "6-4",
  "children" : [{
  "id" : "34",
  "tid" : "19",
  "lid" : "0",
  "name" : "\u6cb3\u5317\u7701\u5de5\u4e1a\u548c\u4fe1\u606f\u5316\u5385",
  "domain" : "ii.gov.cn",
  "secdomain" : "",
  "url" : "http:\/\/www.ii.gov.cn\/index.html"
  }, {
  "id" : "42",
  "tid" : "19",
  "lid" : "0",
  "name" : "\u6e56\u5357\u7701\u5de5\u4e1a\u548c\u4fe1\u606f\u5316\u5385",
  "domain" : "hainan.gov.cn",
  "secdomain" : "",
  "url" : "http:\/\/iitb.hainan.gov.cn\/hnsgxt\/"
  }, {
  "id" : "56",
  "tid" : "19",
  "lid" : "0",
  "name" : "\u5409\u6797\u7701\u5de5\u4e1a\u548c\u4fe1\u606f\u5316\u5385",
  "domain" : "gxt.jl.gov.cn",
  "secdomain" : "",
  "url" : "http:\/\/gxt.jl.gov.cn\/"
  }]
}, {
  "id" : "21",
  "name" : "\u5171\u5efa\u9ad8\u6821",
  "code" : "6-6",
  "children" : []
}, {
  "id" : "23",
  "name" : "\u56fd\u9632\u79d1\u5de5\u529e",
  "code" : "6-7",
  "children" : [{
  "id" : "39",
  "tid" : "23",
  "lid" : "0",
  "name" : "\u6cb3\u5317\u7701\u56fd\u9632\u79d1\u5de5\u5c40",
  "domain" : "hbjg.gov.cn",
  "secdomain" : "",
  "url" : "http:\/\/www.hbjg.gov.cn\/"
  }, {
  "id" : "53",
  "tid" : "23",
  "lid" : "0",
  "name" : "\u6e56\u5357\u7701\u56fd\u9632\u79d1\u5b66\u6280\u672f\u5de5\u4e1a\u529e",
  "domain" : "hngfkgb.gov.cn",
  "secdomain" : "",
  "url" : "http:\/\/www.hngfkgb.gov.cn\/"
  }]
}]
效果:</head>
<body>
<div class="">
<div id="19">
<script type="text/javascript">
  document.write("\u90e8\u5c5e\u5355\u4f4d")
</script>
</div>
<ul class="">
<li id="34">
<a href="http:\/\/www.ii.gov.cn\/index.html">
<script type="text/javascript">
  document.write("\u6cb3\u5317\u7701\u5de5\u4e1a\u548c\u4fe1\u606f\u5316\u5385");
</script></a>
</li>

<li id="42">
<a href="http:\/\/iitb.hainan.gov.cn\/hnsgxt\/">
<script type="text/javascript">
  document.write("\u6e56\u5357\u7701\u5de5\u4e1a\u548c\u4fe1\u606f\u5316\u5385");


</script></a>
</li>

<li id="56">
<a href="http:\/\/gxt.jl.gov.cn\/">
<script type="text/javascript">
  document.write("\u5409\u6797\u7701\u5de5\u4e1a\u548c\u4fe1\u606f\u5316\u5385");
</script></a>
</li>
</ul>
<div id="20">
<script type="text/javascript">
  document.write("\u90e8\u5c5e\u9ad8\u6821")
</script>
</div>
<ul class=""></ul>
<div id="21">
<script type="text/javascript">
  document.write("\u5171\u5efa\u9ad8\u6821")
</script>
</div>
<ul class=""></ul>
<div id="23">
<script type="text/javascript">
  document.write("\u56fd\u9632\u79d1\u5de5\u529e")
</script>
</div>
<ul class="">

<li id="39">
<a href="http:\/\/www.hbjg.gov.cn\/">
<script type="text/javascript">
  document.write("\u6cb3\u5317\u7701\u56fd\u9632\u79d1\u5de5\u5c40");
</script></a>
</li>

<li id="53">
<a href="http:\/\/www.hngfkgb.gov.cn\/">
<script type="text/javascript">
  document.write("\u6e56\u5357\u7701\u56fd\u9632\u79d1\u5b66\u6280\u672f\u5de5\u4e1a\u529e");
</script></a>
</li>

</ul>
</div>
</body>
</html>


[解决办法]

HTML code
<script>document.onready = function(){    var yixuan_navs = [ {      "id" : "19",      "name" : "\u90e8\u5c5e\u5355\u4f4d",      "code" : "6-4",      "children" : [{      "id" : "34",      "tid" : "19",      "lid" : "0",      "name" : "\u6cb3\u5317\u7701\u5de5\u4e1a\u548c\u4fe1\u606f\u5316\u5385",      "domain" : "ii.gov.cn",      "secdomain" : "",      "url" : "http:\/\/www.ii.gov.cn\/index.html"      }, {      "id" : "42",      "tid" : "19",      "lid" : "0",      "name" : "\u6e56\u5357\u7701\u5de5\u4e1a\u548c\u4fe1\u606f\u5316\u5385",      "domain" : "hainan.gov.cn",      "secdomain" : "",      "url" : "http:\/\/iitb.hainan.gov.cn\/hnsgxt\/"      }, {      "id" : "56",      "tid" : "19",      "lid" : "0",      "name" : "\u5409\u6797\u7701\u5de5\u4e1a\u548c\u4fe1\u606f\u5316\u5385",      "domain" : "gxt.jl.gov.cn",      "secdomain" : "",      "url" : "http:\/\/gxt.jl.gov.cn\/"      }]    }, {      "id" : "21",      "name" : "\u5171\u5efa\u9ad8\u6821",      "code" : "6-6",      "children" : []    }, {      "id" : "23",      "name" : "\u56fd\u9632\u79d1\u5de5\u529e",      "code" : "6-7",      "children" : [{      "id" : "39",      "tid" : "23",      "lid" : "0",      "name" : "\u6cb3\u5317\u7701\u56fd\u9632\u79d1\u5de5\u5c40",      "domain" : "hbjg.gov.cn",      "secdomain" : "",      "url" : "http:\/\/www.hbjg.gov.cn\/"      }, {      "id" : "53",      "tid" : "23",      "lid" : "0",      "name" : "\u6e56\u5357\u7701\u56fd\u9632\u79d1\u5b66\u6280\u672f\u5de5\u4e1a\u529e",      "domain" : "hngfkgb.gov.cn",      "secdomain" : "",      "url" : "http:\/\/www.hngfkgb.gov.cn\/"      }]    }];        var html = [];    for (var i = 0; i < yixuan_navs.length; i++) {        var item = yixuan_navs[i];        var child = item.children;        html.push("<div id='"+item.id+"'>"+ item.name +"</div>");        html.push("<ul>");                for (var j = 0; j < child.length; j++) {            html.push("<li id='"+child[j].id+"'><a href='"+child[j].url+"'>"+child[j].name+"</a></li>");        }                html.push("</ul>");    }        document.write(html.join(""));};</script> 

热点排行