码迷,mamicode.com
首页 > 编程语言 > 详细

使用HTML javascript解析xml——我的毕设(二)

时间:2015-05-02 00:58:48      阅读:170      评论:0      收藏:0      [点我收藏+]

标签:

  上回说到,我们已经得到openHab的xml格式页面,这次说我们要开始解析得到的xml了。

  我使用的是Hbuilder,来利用已有APP基座打开一个webview来加载HTML页面,实现app效果。

        <script type="text/javascript">
            $(document).ready(function() {
                $.ajax({
                    url: ‘http://192.168.0.19:8080/rest/items‘,
                    type: ‘GET‘,
                    dataType: ‘xml‘,
                    timeout: 1000,  //设定超时
                    cache: false,   //禁用缓存
                    error: function(xml) {
                        alert("加载XML文档出错!");
                    },
                    success: GetStudentComplete   //设置成功后回调函数
                });
            });
            //获取XML成功后回调函数
            function GetStudentComplete(xml) {
                $(xml).find("item").each(function(i) {     //查找所有student节点并遍历
                    var name = $(this).children("name");          //获得子节点
                    var state = $(this).children("state");          //获得子节点
                    var links = $(this).children("link");
                    var item_name = name.text();                 //获取节点文本
                    var item_state = state.text();  //获取节点的属性
                    var item_link = links.text();
                    var divClass = $(‘<li><a href="‘+item_link+‘">‘+item_name+‘</a></li>‘);
                    $("#main").find(‘ul‘).append(divClass);
                });
            }
        </script>

这里的html body部分如下:

    <body>
        <div id="main" class="mui-content">
            <ul class="mui-table-view">
            </ul>
        </div>
    </body>

我们提取xml文件的name、state、link作为HTML页面的list。今天先进行到这一步。

结果截图如下:

 

技术分享

关于使用美化,我们后面一篇再讲。

———————————原创文章,转载请联系iqinfei@163.com,本文在开源智能家居论坛首发———————————————

使用HTML javascript解析xml——我的毕设(二)

标签:

原文地址:http://www.cnblogs.com/iqinfei/p/4471389.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!