利用getElementsByTagName解析 responseXML 返回的值

最新推荐文章于 2021-01-16 20:57:40 发布

waterwindsxu

最新推荐文章于 2021-01-16 20:57:40 发布

阅读量735

点赞数

分类专栏： javascript

javascript 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

利用getElementsByTagName解析 responseXML 返回的值

分类： Ajax 2008-11-11 11:50 1705人阅读评论(2) 收藏举报

xmlhttprequest ie 测试 firefox button function

以下程序在IE6和Firefox/3.1b1 下测试通过

在Ajax返回的responseXML中，需要对其进行解析，而IE6和Firefox是有点小区别的
以下附上完整代码再解释。
XML文件：

 
  <?xml version="1.0"?>
<options>
    <option>Red</option>
    <option>Green</option>
    <option>Blue</option>
</options>
 
 

HTML：

 
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

 
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>无标题 1</title>
<script type="text/javascript">
var options = false;

 
//创建XMLHttpRequest对象
function CreateRequest()
{
    if (window.XMLHttpRequest)
        return new XMLHttpRequest();
    else if (window.ActiveXObject)
        return new ActiveXObject("Microsoft.XMLHTTP");
    else
        return false;
}
function GetDataFromXML(filename)
{
    var request = CreateRequest();
    if (!request)
        return;
        
    var result = document.getElementById("result");
    var txts = document.getElementById("txts");
    
    request.open("GET", filename);
    request.onreadystatechange = function()
    {
        if (request.readyState==4)
        {
            //由于是本地测试,有时会出现 request.status=0 的情况
            if (request.status==200)
            {
                var xmlDoc;
                //IE6
                if (window.ActiveXObject)
                {
                    xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
                    xmlDoc.async = false;
                    xmlDoc.load(request.responseXML);//不可以是 responseText
                }
                //Firefox
                else
                {
                    xmlDoc = request.responseXML;
                }
                    options = xmlDoc.getElementsByTagName("option");
                txts.value = options.length;
                ListOptions();
            }
        }
    }
    request.send(null);
}
//为select添加选项
function ListOptions()
{
    var select = document.getElementById("select");
    
    for (var i=0; i<options.length; i++)
    {
        select.options[i+1] = new Option(options[i].firstChild.data, options[i].firstChild.data);
    }
}
function SelectChange()
{
    var txts = document.getElementById("show");
    var select = document.getElementById("select");
    txts.style.color = select.value;
}
</script>

 
</head>

 
<body>
    <div>
        <input type="button" id="btn" onclick="GetDataFromXML('test.xml');" value="Submit" />
    </div>
    
    <div id="result">
    
        <select id="select" onchange="SelectChange();">
            <option>==请选择颜色==</option>
        </select>
    
    </div>
    
    <div>
        <textarea cols="10" rows="10" id="txts" style="width:500px; height:300px;" ></textarea>
    </div>
    <div id="show">
        this is show...
    </div>

 
</body>

 
</html>

 
 
 

区别体现在HTML代码中40－51行，IE6中是要创建对象 ActiveXObject("Microsoft.XMLDOM") 对 responseXML对象进行加载后方可用 getElementsByTagName进行解析的。
不知道这点区别而一直在IE6下测试会一头雾水，没报错但也没结果。

为了简单，本程序在创建XMLHttpRequest对象时只考虑了IE6及以上版本和FF，而如果要考虑老版本的IE，则需要更复杂的创建过程。

waterwindsxu

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
利用getElementsByTagName解析 responseXML 返回的值

利用getElementsByTagName解析 responseXML 返回的值分类： Ajax 2008-11-11 11:50 1705人阅读评论(2)收藏举报xmlhttprequestie测试firefoxbuttonfunction以下程序在IE6和Firefox/3.1b1 下测试通过在Ajax返回的responseXML中，需要对其进
复制链接

扫一扫

专栏目录