一、准备工具

站长吧ASP调试工具.exe,这个工具是为了快速建立asp环境,方便调试。

二、建立文件夹

1.建立网站根文件夹,名字随意,将站长吧ASP调试工具.exe复制到根文件夹;

2.建立xml子文件夹,在其中建立book.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>

3.在根文件夹建立index.html页面。

 <html>
<head>
<meta charset="utf-8">
<script type="text/javascript">
//是按钮单击调用的函数
function loadXMLDoc(){
var xmlhttp;//XHR对象
var txt,x,i; //根据不同版本浏览器获得XHR对象
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
} //XHR状态改变函数,这也是前端使用XHR的主要函数
xmlhttp.onreadystatechange=function(){
//下面的条件几乎是固定写法
if (xmlhttp.readyState==4 && xmlhttp.status==200){
//获取从服务器上发回来的数据,为XML类型
xmlDoc=xmlhttp.responseXML;
txt="";
//把标签为"title"的文本对象提取出来,放到数组x中
x=xmlDoc.getElementsByTagName("title");
//逐一读取数组,取得每一个元素第一个节点的值,即图书名称,追加给文本字符串
for (i=0;i<x.length;i++){
txt=txt + x[i].childNodes[0].nodeValue + "<br />";
}
//在文本中更新
document.getElementById("myDiv").innerHTML=txt;
}
}
//执行发送任务
xmlhttp.open("GET","xml/books.xml",true);
xmlhttp.send();
}
</script>
</head> <body> <h2>My Book Collection:</h2>
<div id="myDiv"></div>
<button type="button" onclick="loadXMLDoc()">获得我的图书收藏列表</button> </body>
</html>

三、执行效果

1.运行站长吧ASP调试工具.exe,默认浏览器会自动弹出主页,也可以在浏览器中输入电脑的IP来访问;

2.单击按钮,页面局部刷新。

四、小结:

1.本例中读取的是一个xml文件,所以用了xmlDoc=xmlhttp.responseXML,如果是文本文件或者字符串,就要用到xmlhttp.responseText;

2.具体资料参考http://www.w3school.com.cn/ajax/ajax_xmlhttprequest_response.asp。

Ajax在html页面获取后台XML文件资源的更多相关文章

  1. Android之获取string.xml文件里面的方法

    获取string.xml文件里面的方法 在此做个笔记: 1.在AndroidManifest.xml与layout等xml文件里: android:text="@string/resourc ...

  2. springboot 整合 MongoDB 实现登录注册,html 页面获取后台参数的方法

    springboot简介: Spring Boot是由Pivotal团队提供的全新框架,其设计目的是用来简化新Spring应用的初始搭建以及开发过程.该框架使用了特定的方式来进行配置,从而使开发人员不 ...

  3. java web 通过前台输入的数据(name-value)保存到后台 xml文件中

    一:项目需求,前端有一个页面,页面中可以手动输入一些参数数据,通过点击前端的按钮,使输入的数据保存到后台生成的.xml文件中 二:我在前端使用的是easyui的propertygrid,这个能通过da ...

  4. Android中通过代码获取arrays.xml文件中的数据

    android工程res/valuse文件夹下的arrays.xml文件中用于放各种数组数据,比如字符串数组.整型数组等,数组中的数据可能是具体的值,也有可能是对资源数据的引用,下面针对这两种情况通过 ...

  5. 记录-在jsp页面获取后台值在页面显示过长处理

    在下面的红色标记处 后台获取的值(字符串)在页面显示过长或者与其他重叠 (xxx).cutStr(15) 15代表的是展示字符串的长度 data.rows[i].avgPrice, ), data.r ...

  6. android 通过getDimension,getDimensionPixelOffset和getDimensionPixelSize获取dimens.xml文件里面的变量值

    dimens.xml里写上三个变量: <dimen name="activity_vertical_margin1">16dp</dimen> <di ...

  7. springMVC笔记:jsp页面获取后台数据记录列表

    1.读取数据库中的记录List<HashMap<String,String>> attributes; 2.Controller构造Model如下: @RequestMappi ...

  8. jsp页面获取后台传过来的list集合的长度

    在jsp页面导入函数标签库: <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"% ...

  9. 获取AndroidManifest.xml文件中的meta-data

    以获取高德地图的key值为例 <meta-data android:name="api_key" android:value="l8o0DhNxmvPDpCxTab ...

随机推荐

  1. 007-Scala类的属性和对象私有字段实战详解

    007-Scala类的属性和对象私有字段实战详解 Scala类的使用实战 变量里的类必须赋初值 def函数时如果没参数可不带括号 2.不需要加Public声明 getter与setter实战 gett ...

  2. SSH整合开发的web.xml配置

    <?xml version="1.0" encoding="UTF-8"?><web-app version="2.5" ...

  3. 中小网站如何使用谷歌Adsence国际化优势赚钱?

    劲捷电子信息有限公司是一家拿了美国风险投资的互联网公司.他的创办人祁劲松2005年加入AdSense,迄今收获颇丰,为此他还写了一本 <Google AdSense实战宝典>.在祁劲松看来 ...

  4. C#读写文件的方法汇总_C#教程_脚本之家

    C#读写文件的方法汇总_C#教程_脚本之家 http://www.jb51.net/article/34936.htm

  5. 数据导出到excel

    jsp页面: 数据table: <form action="/export.jsp" method="post" id="expform&quo ...

  6. mybatis配置log4j显示sql语句

    log4j.properties文件下: log4j.rootLogger=DEBUG, Console #Console log4j.appender.Console=org.apache.log4 ...

  7. Axis2测试webservice server以及client

    一.环境搭建 下载axis2-1.6.2-war.zip/axis2-1.6.2-bin.zip等. 参考axis2-1.6.2-war\README.txt以及axis2-1.6.2-war\axi ...

  8. c++类的嵌套(1)

    在一个类的内部定义另一个类或结构体,我们称之为嵌套类(nested class),或者嵌套类型.之所以引入这样一个嵌套类,往往是因为外围类需要使用嵌套类对象作为底层实现,并且该嵌套类只用于外围类的实现 ...

  9. ThinkPHP_基础(1)目录结构

    (说明:文中的颜色一一对应) 目录结构 www WEB部署目录(或者子目录) ├─index.php 入口文件 ├─README.md README文件 ├─composer.json Compose ...

  10. css总结(更新中...)

    下面总结的都是我实际使用后有效的. 1.select的默认样式不好看,怎么去掉默认样式呢,如下: .select{text-indent: inherit !important; background ...