jquery ajax解析XML文件数据方法详解

第一种方案：

 代码如下 复制代码

<script type="text/javascript">
$(document).ready(function() {
 $.ajax({
    url: '/cgi/test.xml',
    dataType: 'xml',
    success: function(data){
     //console.log(data);
    $(data).find("channel").find("item").each(function(index, ele) {
    var titles = $(ele).find("title").text();
    var links = $(ele).find("link").text();
    console.log(titles+'-----');
    $("#noticecon").find('ol').append('<li><a href="'+links+'">'+titles+'</a></li>');
   });
  }
 });
})
</script>

    <div id="noticecon">
  <ol>
  </ol>
 </div>

第二种方案：

 代码如下 复制代码

<script type="text/javascript">
 $.get("/cgi/test.xml", function(data){
  $(data).find('channel').find('item').each(function(index, ele){
   var titles = $(ele).find('title').text();
   var links = $(ele).find('link').text();
   $("#noticecon").find('ol').append('<li><a href="'+links+'">'+titles+'</a></li>');
  })
 });
</script>

    <div id="noticecon">
  <ol>
  </ol>
 </div>

一般步骤如下：

 代码如下 复制代码

$.get("xmlfile.xml",function(xml){
 //xml即为可以读取使用的内容，具体读取见第2点
});

2. 读取xml内容

如果读取的xml是来于xml文件，这结合上面的那点，处理如下：

 代码如下 复制代码

$.get("xmlfile.xml",function(xml){
 //xml即为可以读取使用的内容，具体读取见第2点
});

如果读取的是xml字符串，则要注意一点，xml字符串的必然被"<xml>"和"</xml>"包围才可以被解析

 代码如下 复制代码

$("<xml><root><item></item></root></xml>").find("item").length;

解析xml内容：

示例xml：

 代码如下 复制代码

<?xml version="1.0" encoding="utf-8" ?>
<fields>
  <field Name="Name1">
    <fieldname>dsname</fieldname>
    <datatype>字符</datatype>
  </field>
  <field Name="Name2">
    <fieldname>dstype</fieldname>
    <datatype>字符</datatype>
  </field>
</fields>

以下是解析示例代码：

 代码如下 复制代码

$(xml).find("field").each(function() {
 var field = $(this);
 var fName = field.attr("Name");//读取节点属性
 var dataType = field.find("datatype").text();//读取子节点的值
});

下面看个简单实例

 代码如下 复制代码

XMLFile.xml

<?xml version="1.0" encoding="utf-8" ?>
<msglist>
<msg name="11">
<id>1</id>
<content>content1</content>
</msg>
<msg name="22">
<id>2</id>
<content>content2</content>
</msg>
</msglist>
 

jqXmlFirst.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="jqXmlFirst.aspx.cs" Inherits="jqueryXml_jqXmlFirst" %>
<!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 runat="server">
<title>jQuery操作Xml入门</title>
<script type="text/javascript" src="../js/jquery-1.2.6.js"></script>
<script type="text/javascript">
$(function(){
$.ajax({
url:"XMLFile.xml",
dataType:"xml",
error: function(xml){
alert('Error loading XML document'+xml);
},
success:function(xml){
$(xml).find("msglist > msg").each(function(){
alert($(this).find("content").text());//each是循环执行，即多次弹出。
alert($(this).attr("name"));//取得属性的方法
});
}
})
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
</html>
时间： 2024-08-31 15:41:24

jquery ajax解析XML文件数据方法详解的相关文章

Android编程解析XML文件的方法详解【基于XmlPullParser】

本文实例讲述了Android编程解析XML文件的方法.分享给大家供大家参考,具体如下: 前言 在学习Android的Framework层源码时,Android大量的使用XmlPullParser来解析xml文件的源码.因此,这里也顺道介绍一下XmlPullParser的使用. XML XML(eXtensible Markup Language)中文名为可扩展标记语言.标记指计算机所能理解的信息符号,通过此种标记,计算机之间可以处理包含各种信息的文章等. 用途 XML设计用了传送及携带数据信息,

基于jquery ajax 用户无刷新登录方法详解_jquery

Ajax框架就是提供模块化实现Ajax功能的集合,Ajax框架可以是各种语言实现的(比如SAJAX有各种语言的实现),Ajax只是jquery中的一部分, 实例1 复制代码 代码如下: $.ajax({ type:'post',//可选get url:'action.php',//这里是接收数据的PHP程序 data:'data='dsa',//传给PHP的数据,多个参数用&连接 dataType:'text',//服务器返回的数据类型 可选XML ,Json jsonp script html

jQuery+ajax读取并解析XML文件的方法_jquery

本文实例讲述了jQuery+ajax读取并解析XML文件的方法.分享给大家供大家参考,具体如下: ajax.xml: <?xml version="1.0" encoding="UTF-8"?> <stulist> <student email="1@1.com"> <name>zhangsan</name> <id>1</id> </student>

Jquery Ajax解析XML数据简单实例

 本篇文章主要是对Jquery Ajax解析XML数据(同步及异步调用)的简单实例进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 代码如下: $.ajax({                 async: true, // 默认true(异步请求)                 cache: true, // 默认true,设置为 false 将不会从浏览器缓存中加载请求信息.                 type: "POST", // 默认:GET 请求方式:[PO

jQ处理xml文件和xml字符串的方法(详解)_jquery

1.xml文件 <?xml version="1.0" encoding="utf-8" ?> <root> <book id="1"> <name>锋利的jQuery1</name> <author>XXX1</author> <price>250</price> </book> <book id="2&quo

Android开发之DOM解析xml文件的方法_Android

本文实例讲述了Android中DOM解析xml文件的方法.分享给大家供大家参考,具体如下: 一.在assets文件中写xml文件 <?xml version="1.0" encoding="UTF-8"?> <persons> <person id="23"> <name>李明</name> <age>30</age> </person> <pe

Android开发之DOM解析xml文件的方法

本文实例讲述了Android中DOM解析xml文件的方法.分享给大家供大家参考,具体如下: 一.在assets文件中写xml文件 <?xml version="1.0" encoding="UTF-8"?> <persons> <person id="23"> <name>李明</name> <age>30</age> </person> <pe

jQuery Ajax 全局调用封装实例代码详解_jquery

有一种情况:全站都要用异步方式来调用 数据,提交数据,那么你每次操作 都会要$.ajax({.....}) 写重复的方法 和代码,冗余太大, 也浪费时间,虽说你有代码自动提示补全,但真的不优雅,身为前端极客,是不能允许的! [嘿嘿!虽说我现在基本不用jquery了 ,不过异步概念 是永远要用的,就帮助下新人] jQuery Ajax通用js封装 第一步:引入jQuery库 <script type="text/javascript" src="/js/jquery.mi

在Android系统中解析XML文件的方法_java

前言    在学习Android的Framework层源码时,Android大量的使用XmlPullParser来解析xml文件的源码.因此,这里也顺道介绍一下XmlPullParser的使用. XML    XML(eXtensible Markup Language)中文名为可扩展标记语言.标记指计算机所能理解的信息符号,通过此种标记,计算机之间可以处理包含各种信息的文章等.用途    XML设计用了传送及携带数据信息,不用了表现或展示数据,HTML语言则用了表现数据,所以XML用途的焦点是