首页 > 其他 > 详细

XML+Ajex

时间:2015-08-14 15:53:45      阅读:159      评论:0      收藏:0      [点我收藏+]

--------------XML部分----------

<?xml version="1.0" encoding="utf-8"?>
        <xyj>
             <person>
                 <name>唐僧</name>
                 <sex>男</sex>
                 <info>大唐高僧</info>
             </person>
             <person>
                 <name>孙悟空</name>
                 <sex>男</sex>
                 <info>齐天大圣</info>
             </person>
             <person>
                 <name>猪八戒</name>
                 <sex>男</sex>
                 <info>天蓬元帅</info>
             </person>
             <person>
                 <name>沙悟净</name>
                 <sex>男</sex>
                 <info>卷帘大将</info>
             </person>


        </xyj>

---------HTML和JS部分------------

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<select>
    <option value="唐僧">唐僧</option><!--这里的value一定要有,不然IE6出不来-->
    <option value="孙悟空">孙悟空</option>
    <option value="猪八戒">猪八戒</option>
    <option value="沙悟净">沙悟净</option>
</select>
<div></div>
</body>
<script>
    var select=document.getElementsByTagName("select")[0];
    var div=document.getElementsByTagName("div")[0];
    select.onchange=function(){
        var val=this.value;
        var xmlHttp=window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject("Microsoft.XMLHttp");
        xmlHttp.open("GET",‘xyj.xml‘);
        xmlHttp.send();//发送
        xmlHttp.onreadystatechange=function(){
        if(xmlHttp.readyState==4&&xmlHttp.status==200){
            var xml=xmlHttp.responseXML;
            //alert(xml);
            //alert(xml.getElementsByTagName("person")[0].getElementsByTagName("name")[0].innerHTML)
            var person=xml.getElementsByTagName("person");
            for(var i=0;i<person.length;i++){
                var name=person[i].getElementsByTagName("name")[0].firstChild.nodeValue;//IE不支持在XML里面用innerHTML找文本,但是在HTML是可以用的
                if(name==val){
                    var sex=person[i].getElementsByTagName("sex")[0].firstChild.nodeValue;
                    var info=person[i].getElementsByTagName("info")[0].firstChild.nodeValue;
                    div.innerHTML=sex+"<br/>"+info;
                    return;
                }
            }
            div.innerHTML="未找到结果";
        }
    };
    };
    select.onchange();//打开页面触发一次
</script>
</html>


XML+Ajex

原文:http://my.oschina.net/u/2421889/blog/492333

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!