JS通过ajax动态读取xml文件内容的方法


Posted in Javascript onMarch 24, 2015

本文实例讲述了JS通过ajax动态读取xml文件内容的方法。分享给大家供大家参考。具体分析如下:

下面的JS代码读取note.xml文件,并填充显示相关字段

HTML文件代码如下

<!DOCTYPE html>
<html>
<head>
<script>
function loadXMLDoc(url)
{
var xmlhttp;
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)
  {
  document.getElementById('A1').innerHTML=xmlhttp.status;
  document.getElementById('A2').innerHTML=xmlhttp.statusText;
  document.getElementById('A3').innerHTML=xmlhttp.responseText;
  }
 }
xmlhttp.open("GET",url,true);
xmlhttp.send();
}
</script>
</head>
<body>
<h2>Retrieve data from XML file</h2>
<p><b>Status:</b><span id="A1"></span></p>
<p><b>Status text:</b><span id="A2"></span></p>
<p><b>Response:</b><span id="A3"></span></p>
<button onclick="loadXMLDoc('note.xml')">Get XML data</button>
</body>
</html>

xml文件内容如下

<note>
<to>Tove</to>
<from>Jani</from>
<heading>Reminder</heading>
<body>Don't forget me this weekend!</body>
</note>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
JavaScript中获取元素索引的函数
Sep 10 Javascript
javascript对select标签的控制(option选项/select)
Jan 31 Javascript
Bootstrap每天必学之js插件
Nov 30 Javascript
jQuery元素属性操作实例(设置、获取及删除元素属性)
Sep 08 Javascript
BootStrap与validator 使用笔记(JAVA SpringMVC实现)
Sep 21 Javascript
jQuery+ajax的资源回收处理机制分析
Jan 07 Javascript
微信小程序组件 marquee实例详解
Jun 23 Javascript
基于hover的用法实例(推荐)
Jul 04 Javascript
React Native中NavigatorIOS组件的简单使用详解
Jan 27 Javascript
JS构造一个html文本内容成文件流形式发送到后台
Jul 31 Javascript
在Vue中使用icon 字体图标的方法
Jun 14 Javascript
解决nuxt 自定义全局方法,全局属性,全局变量的问题
Nov 05 Javascript
使用JavaScript 实现的人脸检测
Mar 24 #Javascript
JS使用ajax方法获取指定url的head信息中指定字段值的方法
Mar 24 #Javascript
JS使用ajax从xml文件动态获取数据显示的方法
Mar 24 #Javascript
推荐10 款 SVG 动画的 JavaScript 库
Mar 24 #Javascript
JavaScript中textRange对象使用方法小结
Mar 24 #Javascript
jQuery实现防止提交按钮被双击的方法
Mar 24 #Javascript
使用AngularJS 应用访问 Android 手机的图片库
Mar 24 #Javascript
You might like
Terran建筑一览
2020/03/14 星际争霸
PHP文件下载类
2006/12/06 PHP
使用VisualStudio开发php的图文设置方法
2010/08/21 PHP
php通过文件头判断格式的方法
2016/05/28 PHP
php简单处理XML数据的方法示例
2017/05/19 PHP
Linux下源码包安装Swoole及基本使用操作图文详解
2019/04/02 PHP
JQuery 引发两次$(document.ready)事件
2010/01/15 Javascript
js正则表达exec与match的区别说明
2014/01/29 Javascript
JavaScript中实现PHP的打乱数组函数shuffle实例
2014/10/11 Javascript
完美解决jQuery 鼠标快速滑过后,会执行多次滑出的问题
2016/12/08 Javascript
js实现百度登录框鼠标拖拽效果
2017/03/07 Javascript
深入讲解xhr(XMLHttpRequest)/jsonp请求之abort
2017/07/26 Javascript
javascript 日期相减-在线教程(附代码)
2017/08/17 Javascript
js定时器实现倒计时效果
2017/11/05 Javascript
详解element-ui中表单验证的三种方式
2019/09/18 Javascript
vue封装自定义指令之动态显示title操作(溢出显示,不溢出不显示)
2020/11/12 Javascript
jQuery实现穿梭框效果
2021/01/19 jQuery
Python协程的用法和例子详解
2017/09/09 Python
python实现读取excel写入mysql的小工具详解
2017/11/20 Python
python爬虫爬取淘宝商品信息
2018/02/23 Python
pandas的qcut()方法详解
2019/07/06 Python
Django在pycharm下修改默认启动端口的方法
2019/07/26 Python
Python 切分数组实例解析
2019/11/07 Python
解决在keras中使用model.save()函数保存模型失败的问题
2020/05/21 Python
Tensorflow之MNIST CNN实现并保存、加载模型
2020/06/17 Python
pycharm最新激活码有效期至2100年(亲测可用)
2021/02/05 Python
CSS3 clip-path 用法介绍详解
2018/03/01 HTML / CSS
CSS3 2D模拟实现摩天轮旋转效果
2016/11/16 HTML / CSS
保加利亚服装和鞋类购物网站:Bibloo.bg
2020/11/08 全球购物
运动会加油口号
2014/06/07 职场文书
社区党员群众路线教育实践活动心得体会
2014/11/03 职场文书
趣味运动会口号
2015/12/24 职场文书
2019班干部竞选演讲稿范本!
2019/07/08 职场文书
react中props 的使用及进行限制的方法
2021/04/28 Javascript
Windows和Linux上部署Golang并运行程序
2022/04/22 Servers
基于Android10渲染Surface的创建过程
2022/08/14 Java/Android