前台解析XML对象小例【ajax XHR(服务器响应)】

最新推荐文章于 2024-02-06 15:29:34 发布
最新推荐文章于 2024-02-06 15:29:34 发布
阅读量467 收藏
点赞数
分类专栏： JQuery Web前端

XML文件内容  ：

<?xml version="1.0" encoding="ISO-8859-1" ?>

<!-- 
  Copyright w3school.com.cn
  -->
<!-- 
 W3School.com.cn bookstore example
  -->
- < bookstore >
- < book category =" children ">
  < title lang =" en "> Harry Potter </ title >
  < author > J K. Rowling </ author >
  < year > 2005 </ year >
  < price > 29.99 </ price >
  </ book >
- < book category =" cooking ">
  < title lang =" en "> Everyday Italian </ title >
  < author > Giada De Laurentiis </ author >
  < year > 2005 </ year >
  < price > 30.00 </ price >
  </ book >
- < book category =" web " cover =" paperback ">
  < title lang =" en "> Learning XML </ title >
  < author > Erik T. Ray </ author >
  < year > 2003 </ year >
  < price > 39.95 </ price >
  </ book >
- < book category =" web ">
  < title lang =" en "> XQuery Kick Start </ title >
  < author > James McGovern </ author >
  < author > Per Bothner </ author >
  < author > Kurt Cagle </ author >
  < author > James Linn </ author >
  < author > Vaidyanathan Nagarajan </ author >
  < year > 2003 </ year >
  < price > 49.99 </ price >
  </ book >
  </ bookstore >

 

 

前台DOM如下：

<html>
<head>
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp;
var txt,x,i;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    xmlDoc=xmlhttp.responseXML;
    txt=" ";
    x=xmlDoc.getElementsByTagName("year");
    for (i=0;i<x.length;i++)
      {
      txt=txt + x[i].childNodes[0].nodeValue + "<br />";
      }
    document.getElementById("myDiv").innerHTML=txt;
    }
  }
xmlhttp.open("GET","/example/xmle/books.xml",true);
xmlhttp.send();
}
</script>
</head>

<body>

<h2>My Book Collection:</h2>
<div id="myDiv"></div>
<button type="button" οnclick="loadXMLDoc()">获得我的图书收藏列表</button>
</body>
</html>

 

 

运行结果（<div id="myDiv></div>中显示内容："）：

Harry Potter
Everyday Italian
Learning XML
XQuery Kick Start

 

Rhythm_dreams
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Ajax与XML
一个程序员的复习笔记
08-20 2984
Ajax请求后台返回数据时，都是简单的字符串或数字； 如果后台有大量数据要返回，我们应该怎么办？ 目前有两种技术方案： 1：将数据打包成 XML 的格式进行传输 2：将数据打包成 json 的格式进行传输 XML基本语法规则 XML 文档必须有根元素，根元素是所有其他元素的父元素 &lt;root&gt; &lt;child&gt; &lt;subchild&gt...
xml--通过DOM解析XML
GP的空间
08-15 3302
此文章通过3个例子表示DOM方式解析XML的用法。   通过DOM解析XML必须要写的3行代码. step 1: 获得dom解析器工厂（工作的作用是用于创建具体的解析器） step 2:获得具体的dom解析器 step 3: 解析一个xml文档，获得Document对象（根结点）   第一个例子通过简单的名称，取出对应元素的值。 例子1： package com.text.too
XML解析及作用
最新发布
2202_75627180的博客
02-06 811
用来保存数据,而且这些数据具有自我描述性.它还可以作为项目或者模板的配置文件还可以作为网络传输数据的格式(现在以JSON为主)
前端解析xml
weixin_42863883的博客
10-19 1412
xml 解析 soap
JavaScript实现解析xml文件数据
m0_70015558的博客
05-26 1万+
​ 用js来解析xml文件，xml格式的数据很普遍，特别是一些老项目普遍都用xml格式的数据。在ajax里有个responseXML就返回的是xml格式的数据，下面是js如何解析xml文件，获得里面的数据。话不多说，直接上传。 ​.........
解析后台返回的XML
记录点点滴滴
03-20 2251
public class ParseXML{ public Map parseXMl(String xml)throws Exception{ Map UserListMap = new HashMap(); List userList = new ArrayList(); Document document = null;  try { document = DocumentHelper.par
ajax获取服务器以xml形式输出省市数据，并获取数据绑定前台下拉框和实现联动
04-22
接下来，我们需要解析XML数据。在JavaScript中，我们可以使用DOM（Document Object Model）接口来操作XML文档。例如，如果XML数据包含省市信息，我们可能有如下结构： ```xml 省份1 城市1-1 城市1-2 ...
ajax响应json字符串和json数组的实例(详解)
10-20
前台可以使用JavaScript内置的JSON对象来解析服务器响应的JSON字符串。解析后的JSON数据会被转换成JavaScript对象，之后可以方便地使用。 现在，让我们深入文章内容中的实例： **实例1：后台响应JSON字符串** 在...
ajax 解析json数据
01-12
在Web开发中，AJAX（Asynchronous JavaScript and XML）是一种创建动态网页的技术，它允许页面在不重新加载整个页面的情况下与服务器交换数据并更新部分网页内容。JSON（JavaScript Object Notation）是一种轻量级的...
js前台分页显示后端JAVA数据响应
10-27
Ajax（异步JavaScript和XML）是前端与后端通信的重要手段。在示例中，可能有一个类似于`findPage`的函数，它通过`$.ajax`或者简化的`$.get`或`$.post`方法发送HTTP请求到Java Servlet，携带当前页码等参数。例如： ...
在html中解析xml文件(javascript 读取)
阅微草堂
09-19 5134
[html] view plain copy   xml version="1.0"?>      note>   to>Georgeto>   from>Johnfrom>   heading>Reminderheading>   body>Don't forget the meeting!body>   lastname>Simthlastname> 
前端 读取XML文件
cuishouming的博客
08-15 1万+
Jquery读取下xml文件。 代码如下： html内容 &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999...
前端js中解析XML文件（一）
javadxz的专栏
07-27 7477
IE浏览器中的XML解析器是通过ActiveX控件所实现的，，通过以下的代码来引用XML解析器。var xmldoc = new ActiveXObject("Microsoft.XMLDOM");以上的代码可以创建一个XMLDOM对象，使用该对象可以加载一个XML文件，加载方式
浅谈解析XML文件的跨浏览器实例
筱葭的博客
03-16 1314
所有现代浏览器都有读取和操作 XML 的内建 XML 解析器。 解析器把 XML 载入内存，然后把它转换为可通过 JavaScript 访问的 XML DOM 对象。 if (window.XMLHttpRequest) // IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); else // IE6, IE5
前台HTML页面显示XML内容
热门推荐
MOONCOM的博客
07-26 2万+
应用场景：在网站开发过程中，读取XML格式文件，并将其所有内容都显示到页面上，即显示标签内容，又显示标签本身。 备注：本博客场景还适应于读取显示含有标签的数据库存储字段。 解决方法：解决方法一共有四种(可能还有别的方法，但我只知道四种，欢迎大家补充)，分别如下： 第一种，使用 将你要显示的内容包含在标签中，便可以将标签显示在页面上。 JS代码： var str
DOM的概念和简单应用：使用DOM解析XML数据
weixin_34224941的博客
05-21 264
概念：DOM是Document Object Model的简称，即文档数据模型。 Oracle公司提供了JAXP（Java API for XML Processing）来解析XML。JAXP会把XML文档转换成一个DOM树，JAXP的三个包都在JDK中。 org.w3c.dom;W3C推荐的解析文档的接口 org.xml.sax;使用SAX解析XML文档的接口 javax.xml.par...
js请求解析xml
独行僧
10-25 1619
xml数据<?xml version="1.0" encoding="utf-8"?> <table> <node name="node1" id="0"> <text title="test" content="详情" /> <img name="image" /> <pic name="test.jpg" /> <pic
尚硅谷Ajax教程：异步JavaScript与XML技术解析
"尚硅谷Ajax课程的讲义内容涵盖了AJAX的基本概念、XML的简介、AJAX的特点以及使用XMLHttpRequest对象实现AJAX的核心步骤。" 本文档是尚硅谷的前端课程系列之一，专注于讲解AJAX（异步JavaScript和XML）技术。AJAX是...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值