jquery解析XML文件

html代码

<!DOCTYPE html>

<html>

<head>

<title>解析XML</title>

<meta charset='utf-8' />

<meta http-equiv="Access-Control-Allow-Origin" content="*">

<script src="http://code.jquery.com/jquery-1.10.2.js"></script>

</head>

<body>

<div id="book">

</div>

</body>


</html>

css代码

<style type="text/css">

#book{

    position: relative;

    border: 1px green solid;

    width: 200px;

}

#book .book{

    position: relative;

    border: 2px #aaa solid;

}

#book .name{

    position: relative;

    background-color: #999;

    color: #fff;

}

#book .title{

border-bottom: 1px #999 solid;




}


book .content{


position: relative;

word-break:break-all;

word-wrap:break-all;




}


</style>

js代码

<script type="text/javascript">

    $.get('book.xml',function(xml){

        var len = $(xml).find('book').length;

        $(xml).find("book").each(function() {

            var book = $(this);

            for (var i = 0; i < book.length; i++) {

                var name = book.attr("name");//读取节点属性

                var title = book.find("title").text();//读取子节点的值

                var content = book.find("content").text();

                var html  = '<div class="book">';

                    html += '<div class="name">'+name+'</div>';

                    html += '<div class="title">'+title+'</div>';

                    html += '<div class="content">'+content+'</div>';

                var content = book.find("content").text();

                $('#book').append(html);

            };

        });

});




</script>

XML文件 book.xml

    <?xml version="1.0" encoding="UTF-8"?>

<books>

<book  name="MongoDB">

    <title>MongoDB</title>

    <content>MongoDBMongoDBMongoDBMongoDBMongoDBMongoDBMongoDBMongoDB</content>

</book>

<book  name="Nodejs">

    <title>Nodejs</title>

    <content>MongoDBMongoDBMongoDBMongoDBMongoDBMongoDBMongoDBMongoDB</content>

</book>

<book  name="Bootstrap">

    <title>Bootstrap</title>

    <content>MongoDBMongoDBMongoDBMongoDBMongoDBMongoDBMongoDBMongoDB</content>

</book>

<book  name="JavaScript">

    <title>JavaScript</title>

    <content>JavaScriptJavaScriptJavaScriptJavaScriptJavaScript</content>

</book>

</books>

jquery解析XML(1)的更多相关文章

  1. 使用Jquery解析xml的两种方法

    第一种方案(最稳妥): 先将String格式的xml转换为xml对象,然后再用Jquery解析xml对象 var returnDataXml = parseXML(returnData); var p ...

  2. 160928、JQuery解析XML数据的demo

    用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做.下面我们来总结几个使用JQuery解析XML的例子. 方案1 当后台返回的数据类型是xml对象 ...

  3. 使用jQuery解析xml时command节点解析失败

    jQuery版本1.8.3 待解析的xml为: <message><user><command>Login</command></message& ...

  4. JQuery解析XML数据的几个例子

    用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做.下面我们来总结几个使用JQuery解析XML的例子. 第一种方案: <script ty ...

  5. JQuery 解析xml

    JQuery 可以通过 $.get() 或 $.post() 方法来加载 xml.     JQuery 解析 XML 与解析 DOM 一样, 可以使用 find(), children() 等函数来 ...

  6. 轻松使用jquery解析XML

    xml文件结构:books.xml <?xml version="1.0" encoding="UTF-8"?><root>    &l ...

  7. 160708、JQuery解析XML数据的demo

    用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做.下面我们来总结几个使用JQuery解析XML的例子. 方案1 当后台返回的数据类型是xml对象 ...

  8. JQuery -- Jquery 中的Ajax, Jquery解析xml文件

    1. JQuery 对 Ajax 操作进行了封装,在 jQuery 中最底层的方法时 $.ajax(), 第二层是 load(), $.get() 和 $.post(),第三层是$.getScript ...

  9. 几个JQuery解析XML的程序例子

    用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做.下面我们来总结几个使用JQuery解析XML的例子. 第一种方案: <script ty ...

随机推荐

  1. ActionBarSherlock

    https://github.com/JakeWharton/ActionBarSherlock https://github.com/ddewaele/GoogleMapsV2WithActionB ...

  2. android112 c代码打印日志，c反编译调用java

    activity: package com.itheima.ccalljava; import android.os.Bundle; import android.app.Activity; impo ...

  3. bootstrap系列整理

    去年的九月份做第一版文档站时, 就开始尝试使用bootstrap ,由于当时对node 还一知半解,大部分精力放在nodejs上,bootstrap只是拿来就用,起步文档都没看: 当别人提到 Norm ...

  4. AIR lame参数配置

    -Duser.name=Z.yu 固定码率的例子:=======================================================================固定码率 ...

  5. ZBLibrary不能运行的解决方法

    ADT运行   右键ZBLibrary Demo > Run as > Android Application 可能出现部分错误,解决方案如下: 右键Project(这里为ZBLibrar ...

  6. IEnumerable 和 IQueryable

    共有两组 LINQ 标准查询运算符,一组在类型为 IEnumerable<T> 的对象上运行,另一组在类型为 IQueryable<T> 的对象上运行.构成每组运算符的方法分别 ...

  7. Java并发——Fork/Join框架

    为了防止无良网站的爬虫抓取文章,特此标识,转载请注明文章出处.LaplaceDemon/ShiJiaqi. http://www.cnblogs.com/shijiaqi1066/p/4631466. ...

  8. 学点css之经验总结篇章

    学css说起来应该有三天左右的时间的,加上之前了解的基础,对css有一点的感性认识了,相应代码有有比较好的把握,现在就通过分享几张照片的形式分享一下我的收获 备注:在Border的外边的部门被称作:o ...

  9. Velocity 模板引擎介绍

    一.变量 1. 变量定义 #set($name =“velocity”) 2. 变量的使用 在模板文件中使用$name 或者${name} 来使用定义的变量.推荐使用${name} 这种格式,因为在模 ...

  10. 小巧、高效、美观的弹出日历组件 ——lhgcalendar

    http://www.cnblogs.com/lhgstudio/archive/2009/02/13/1390381.html 没法上传附件,请到以上地址下载 下载地址:http://files.c ...