用ajax xml的数据读取的HelloWorld程序
程序员文章站
2022-03-31 13:52:40
俗话说的好,说起来容易做起来难,放在编程上说是看起来容易编起来难,虽说ajax里面没有什么新的技术,只是思想的转变和旧技术的整合,但是动起手来还是问题多多,首先就是我经常使...
俗话说的好,说起来容易做起来难,放在编程上说是看起来容易编起来难,虽说ajax里面没有什么新的技术,只是思想的转变和旧技术的整合,但是动起手来还是问题多多,首先就是我经常使用的是火狐浏览器,马上就碰到了innertext在火狐里面不被兼容的问题,刚开始找不到原因,后来突然反应过来可能是兼容的问题,百度一下,果不其然,在ff里面要使用textcontent方法,且一定要遵从w3c标准使用getelementbyid获取div,不能图省事直接写id,在ie里面行的通,在火狐和其他浏览器就不知道了,还是按标准来吧,这样也有可读性嘛^_^
代码:
<!doctype html public "-//w3c//dtd xhtml 1.0 strict//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd">
<html>
<head>
<title>ajax的第一个经典例子hello world</title>
<script type="text/javascript">
var xmlhttp;
function createxmlhttprequest(){
if(window.activexobject){
xmlhttp = new activexobject("microsoft.xmlhttp");
}
else if(window.xmlhttprequest){
xmlhttp = new xmlhttprequest();
}
}
function startrequest(){
createxmlhttprequest();
try{
xmlhttp.onreadystatechange = handlestatechange;
xmlhttp.open("get", "data.xml", true);
xmlhttp.send(null);
}catch(exception){
alert("您要访问的资源不存在!");
}
}
function handlestatechange(){
if(xmlhttp.readystate == 4){
if (xmlhttp.status == 200 || xmlhttp.status == 0){
// 取得xml的dom对象
var xmldom = xmlhttp.responsexml;
// 取得xml文档的根
var root = xmldom.documentelement;
try
{
// 取得<info>结果
var info = root.getelementsbytagname('info');
// 取字符串
var str_data = info[0].firstchild.data;
//改变div的内容,调用changetext函数,注意ie和ff是不一样的
changetext(info[0].firstchild.data,'showtext');
//innerhtml是一样的
document.getelementbyid("showtexthtml").innerhtml = '<strong>' + info[0].firstchild.data + '</strong>';
}catch(exception)
{
}
}
}
}
function changetext(str,element){ //兼容ie和ff的
if(navigator.appname.indexof("explorer") > -1){
document.getelementbyid(element).innertext = str;
} else{
document.getelementbyid(element).textcontent = str;
}
}
</script>
</head>
<body>
<div>
<input type="button" value="return ajax responsexml's value"
onclick="startrequest();" />
</div>
<div id="showtext"></div>
<div id="showtexthtml"></div>
</body>
</html>
代码:
复制代码 代码如下:
<!doctype html public "-//w3c//dtd xhtml 1.0 strict//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd">
<html>
<head>
<title>ajax的第一个经典例子hello world</title>
<script type="text/javascript">
var xmlhttp;
function createxmlhttprequest(){
if(window.activexobject){
xmlhttp = new activexobject("microsoft.xmlhttp");
}
else if(window.xmlhttprequest){
xmlhttp = new xmlhttprequest();
}
}
function startrequest(){
createxmlhttprequest();
try{
xmlhttp.onreadystatechange = handlestatechange;
xmlhttp.open("get", "data.xml", true);
xmlhttp.send(null);
}catch(exception){
alert("您要访问的资源不存在!");
}
}
function handlestatechange(){
if(xmlhttp.readystate == 4){
if (xmlhttp.status == 200 || xmlhttp.status == 0){
// 取得xml的dom对象
var xmldom = xmlhttp.responsexml;
// 取得xml文档的根
var root = xmldom.documentelement;
try
{
// 取得<info>结果
var info = root.getelementsbytagname('info');
// 取字符串
var str_data = info[0].firstchild.data;
//改变div的内容,调用changetext函数,注意ie和ff是不一样的
changetext(info[0].firstchild.data,'showtext');
//innerhtml是一样的
document.getelementbyid("showtexthtml").innerhtml = '<strong>' + info[0].firstchild.data + '</strong>';
}catch(exception)
{
}
}
}
}
function changetext(str,element){ //兼容ie和ff的
if(navigator.appname.indexof("explorer") > -1){
document.getelementbyid(element).innertext = str;
} else{
document.getelementbyid(element).textcontent = str;
}
}
</script>
</head>
<body>
<div>
<input type="button" value="return ajax responsexml's value"
onclick="startrequest();" />
</div>
<div id="showtext"></div>
<div id="showtexthtml"></div>
</body>
</html>
上一篇: 一台体验极佳的高端游戏主机该用什么配置?
下一篇: 居家幽默,吵吵闹闹皆是笑
推荐阅读
-
google file system 用PHP获取Google AJAX Search API 数据的代码
-
用Spring Boot进行后端开发(二):与微信小程序的交互,在微信小程序端获取数据并显示
-
google file system 用PHP获取Google AJAX Search API 数据的代码
-
C#递归读取XML菜单数据的方法
-
C#递归读取XML菜单数据的方法
-
javascript解析ajax返回的xml和json格式数据实例详解
-
Android开发实现读取excel数据并保存为xml的方法
-
C#从数据库读取数据到DataSet并保存到xml文件的方法
-
将PHP程序中返回的JSON格式数据用gzip压缩输出的方法
-
php从数据库中获取数据用ajax传送到前台的方法