jquery解析XML(1)
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)的更多相关文章
- 使用Jquery解析xml的两种方法
第一种方案(最稳妥): 先将String格式的xml转换为xml对象,然后再用Jquery解析xml对象 var returnDataXml = parseXML(returnData); var p ...
- 160928、JQuery解析XML数据的demo
用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做.下面我们来总结几个使用JQuery解析XML的例子. 方案1 当后台返回的数据类型是xml对象 ...
- 使用jQuery解析xml时command节点解析失败
jQuery版本1.8.3 待解析的xml为: <message><user><command>Login</command></message& ...
- JQuery解析XML数据的几个例子
用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做.下面我们来总结几个使用JQuery解析XML的例子. 第一种方案: <script ty ...
- JQuery 解析xml
JQuery 可以通过 $.get() 或 $.post() 方法来加载 xml. JQuery 解析 XML 与解析 DOM 一样, 可以使用 find(), children() 等函数来 ...
- 轻松使用jquery解析XML
xml文件结构:books.xml <?xml version="1.0" encoding="UTF-8"?><root> &l ...
- 160708、JQuery解析XML数据的demo
用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做.下面我们来总结几个使用JQuery解析XML的例子. 方案1 当后台返回的数据类型是xml对象 ...
- JQuery -- Jquery 中的Ajax, Jquery解析xml文件
1. JQuery 对 Ajax 操作进行了封装,在 jQuery 中最底层的方法时 $.ajax(), 第二层是 load(), $.get() 和 $.post(),第三层是$.getScript ...
- 几个JQuery解析XML的程序例子
用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做.下面我们来总结几个使用JQuery解析XML的例子. 第一种方案: <script ty ...
随机推荐
- HTML5 中的一些新特性
HTML5是HTML最新的修订版本,包含了新的标签元素,属性和行为,同时包含了一系列可以被用来让 Web 站点和应用更加多样化,功能更强大的技术.HTML5实现了不依赖flash插件播放视频,而且引入 ...
- servlet三大作用域：request，session，application
javaweb开发中Servlet三大域对象的应用(request.session.application(ServletContext)). 1. request request是表示一个请求,只要 ...
- int 指令
int n 也就是中断操作->根据中断类型码来查找中断向量表(中断向量表在0-3ffh这个内存空间) 调用int n 也就操作了下面的步骤 1)取中断类型码n: 2)标志寄存器入栈,IF=0,T ...
- iOS 火星坐标相关整理及解决方案汇总(转)
这几天在处理定位相关的代码,彻彻底底的被火星坐标恶心到了. 恶心列表 从 CLLocationManager 取出来的经纬度放到 mapView 上显示,是错的! 从 CLLocationManage ...
- Java生成word文档
itext-rtf-2.1.7.jar,下载地址:http://download.csdn.net/detail/xuxu198899223/7717727 itext-2.1.7.jar 下载地址: ...
- careercup-排序和查找 11.5
11.5 有个排序后的字符串数组,其中散布着一些空字符串,编写一个方法,找出给定字符串的位置. 解法: 如果没有那些空字符串,就可以直接使用二分查找法.比较待查找字符串str和数组的中间元素,然后继续 ...
- 解决ubuntu16.04下的sublime text3不能使用Fcitx下的搜狗输入法的问题
Sublime Text 2/3 输入法(Fcitx)修复[Ubuntu(Debian)] 主要目的 安装 Sublime Text 3 安装 Fcitx 输入法 + 皮肤 修复 Sublime Te ...
- 转：maven报错非法字符：\65279 错误
开发中一个项目很早就报这个错,maven报错非法字符:\65279 错误,今天终于忍无可忍要解决它 :编译java文件的时候,有些java文件报非法字符 \65279错误,在网上找和很多 方法,也试了 ...
- Ganymed SSH-2 for Java
Ganymed SSH-2 for Java是一个纯Java实现的SHH2库,官网为http://www.ganymed.ethz.ch/ssh2/,最新的更新时间为2006年10月,在用之前,请仔细 ...
- document.all的用法详解
all[] 已经被 Document 接口的标准的 getElementByid() 方法和 getElementsByTagName() 方法以及 Document 对象的 getElementsB ...