小技巧(11)-Jquery递归获取XML数据生成ul-li结构

最新推荐文章于 2020-12-31 12:30:28 发布

weixin_30500105

最新推荐文章于 2020-12-31 12:30:28 发布

阅读量137

点赞数

文章标签： xhtml javascript ViewUI

原文链接：http://www.cnblogs.com/jimmypony/archive/2008/08/27/1277712.html

版权

Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>jquery递归绑定XML代码</title>

    <script src="jquery-1.2.6.min.js" type="text/javascript"></script>
    <script type="text/javascript">
/*
    主程式-实现递归获取数据的方法
*/
        var xmlLoader =function(xml,li){
            if(!xml ||li==undefined){
                alert('xml error!');
                return;
            }
//可能这里设计的不是很好,因为有root根目录,所以每次都要判断是否有相关的属性
            if(xml.getAttribute('id'))
                li+='<li><a class="myclass" href='+xml.getAttribute('id')+'>'+xml.getAttribute('name')+'</a>'
            if(xml.hasChildNodes())
            {
                if(xml.getAttribute('id'))
                    li+='<ul>';
                for(var i=0;i<xml.childNodes.length;i++)
                {
                    li=xmlLoader(xml.childNodes[i],li);
                }
                if(xml.getAttribute('id'))
                    li+='</ul>';
            }
            if(xml.getAttribute('id'))
                li+='</li>';
            return li;
        }
//这里是jquery获取xmlNode
        $(function(){
            $.ajax({
                 type: "GET",
                 url: "treeview.xml",
                 dataType: "xml",
                 success: function(xml) {
                    var li="";
                    var root =xmlLoader(xml.childNodes[0],li);
                    $('#ul_id').html(root);
                 }
             });
        });
    </script>
</head>
<body>
<ul id='ul_id'>
</ul>
</body>
</html>

以下是xml文件

Code
<root>
  <Type name="aaa" id="1">
    <Type name="ddd" id="4">
      <Type name="eee" id="5"/>
      <Type name="ggg" id="6"/>
    </Type>
    <Type name="fff" id="1"/>
  </Type>
  <Type name="bbb" id="2">
    <Type name="ccc" id="3"/>
  </Type>
</root>

以上在VS上通过却在editplus上过不去.....

转载于:https://www.cnblogs.com/jimmypony/archive/2008/08/27/1277712.html

weixin_30500105

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
小技巧(11)-Jquery递归获取XML数据生成ul-li结构

Code<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head>...
复制链接

扫一扫