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 相关文章推荐
Jquery数独游戏解析(一)-页面布局
Nov 05 Javascript
javascript阻止scroll事件多次执行的思路及实现
Nov 08 Javascript
JavaScript的原型继承详解
Feb 15 Javascript
Javascript优化技巧之短路表达式详细介绍
Mar 27 Javascript
freemarker判断对象是否为空的方法
Aug 13 Javascript
剖析Node.js异步编程中的回调与代码设计模式
Feb 16 Javascript
Angular ng-repeat遍历渲染完页面后执行其他操作详细介绍
Dec 13 Javascript
JS判断时间段的实现代码
Jun 14 Javascript
Vue 自适应高度表格的实现方法
May 13 Javascript
jQuery实现简单飞机大战
Jul 05 jQuery
微信小程序实现签到弹窗动画
Sep 21 Javascript
JS如何调用WebAssembly编译出来的.wasm文件
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
centos 5.6 升级php到5.3的方法
2011/05/14 PHP
PHP的Yii框架中过滤器相关的使用总结
2016/03/29 PHP
浅谈PHP进程管理
2019/03/08 PHP
接收键盘指令的脚本
2006/06/26 Javascript
特殊字符、常规符号及其代码对照表
2006/06/26 Javascript
用js实现多域名不同文件的调用方法
2007/01/12 Javascript
jQuery ajax(复习)—Baidu ajax request分离版
2013/01/24 Javascript
javascript和HTML5利用canvas构建猜牌游戏实现算法
2013/07/17 Javascript
常见的原始JS选择器使用方法总结
2014/04/09 Javascript
jQuery.prop() 使用详解
2015/07/19 Javascript
浅谈javascript中遇到的字符串对象处理
2016/11/18 Javascript
使用nodejs爬取前程无忧前端技能排行
2017/05/06 NodeJs
详解jQuery中关于Ajax的几个常用的函数
2017/07/17 jQuery
在Create React App中使用CSS Modules的方法示例
2019/01/15 Javascript
浅谈VUE防抖与节流的最佳解决方案(函数式组件)
2019/05/22 Javascript
vue调用语音播放的方法
2019/09/27 Javascript
详解Vue的watch中的immediate与watch是什么意思
2019/12/30 Javascript
[01:00:13]完美世界DOTA2联赛 LBZS vs Forest 第一场 11.07
2020/11/09 DOTA
win7安装python生成随机数代码分享
2013/12/27 Python
Python下载懒人图库JavaScript特效
2015/05/28 Python
Pandas 合并多个Dataframe(merge,concat)的方法
2018/06/08 Python
Python 类的特殊成员解析
2018/06/20 Python
Python使用POP3和SMTP协议收发邮件的示例代码
2019/04/16 Python
Pycharm创建项目时如何自动添加头部信息
2019/11/14 Python
python3实现名片管理系统(控制台版)
2020/11/29 Python
香港交友网站:be2香港
2018/07/22 全球购物
美国领先的家庭健康检测试剂盒提供商:LetsGetChecked
2019/03/18 全球购物
公司年会晚宴演讲稿
2014/01/06 职场文书
CAD制图人员的自荐信
2014/02/07 职场文书
小学语文教学经验交流材料
2014/06/02 职场文书
时尚女魔头观后感
2015/06/04 职场文书
校友会致辞
2015/07/30 职场文书
乔迁新居祝福语
2019/11/04 职场文书
一行代码python实现文件共享服务器
2021/04/22 Python
JavaScript的function函数详细介绍
2021/11/20 Javascript
HTML页面点击按钮关闭页面的多种方式
2022/12/24 HTML / CSS