首页 > 代码库 > 原生ajax练习-post&xml
原生ajax练习-post&xml
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <style> h2 {color: #555; } .p1 {color: #f99; } .p2 {color: #9f9; } .p3 {color: #99f; } </style> <ul id="ul"> <li> <p class="p4"></p> <h2></h2> <p class="p1"></p> <p class="p2"></p> <p class="p3"></p> </li> </ul> </body> </html> <script> window.onload = function() { var xhr = null; if(window.XMLHttpRequest){ xhr = new XMLHttpRequest(); }else{ xhr = new ActiveXObject(‘Microsoft.XMLHTTP‘); } var url = ‘xml/1.xml?‘; var para = ‘?_t=‘+new Date().getTime();//传递到send()当中去,不会有缓存 // xhr.setRequestHeader(‘Content-Type‘,‘application/x-form-www-urlencoded‘) // Failed to execute ‘setRequestHeader‘ on ‘XMLHttpRequest‘: The object‘s state must be OPENED. xhr.open(‘post‘,url,true);//url中不再包含参数 xhr.setRequestHeader(‘Content-Type‘,‘application/x-form-www-urlencoded‘)//必须位于open之后,send之前 xhr.send(para); xhr.onreadystatechange = function () { if(xhr.readyState == 4 && xhr.status == 200 ) { //得到的XML是一个对象,这个对象有各种属性和方法 var data = xhr.responseXML; var NOVEL = data.getElementsByTagName(‘NOVEL‘)[0]; var books = NOVEL.getElementsByTagName(‘book‘); var len = books.length; //console.log(NOVEL); var str = ‘‘; for(var i=0;i<len;i++) { str+= ‘<li><h2>‘+getNodeText(books[i].getElementsByTagName(‘name‘)[0])+‘</h2>‘; str+= ‘<p class="p4">‘+getNodeText(books[i].getElementsByTagName(‘author‘)[0])+‘</p>‘; str+= ‘<p class="p2">‘+getNodeText(books[i].getElementsByTagName(‘publish_time‘)[0])+‘</p>‘; str+= ‘<p class="p3">‘+getNodeText(books[i].getElementsByTagName(‘publish_time‘)[0])+‘</p>‘; str+= ‘<p class="p1">‘+getNodeText(books[i].getElementsByTagName(‘publish_time‘)[0])+‘</p></li>‘; } document.getElementById(‘ul‘).innerHTML = str; } } function getNodeText(node){ if(window.ActiveXObject){//IE return node.text; }else{//标准浏览器 if(node.nodeType == 1){ return node.textContent; } } } } </script>
<?xml version="1.0" encoding="utf-8"?> <bookstore> <NOVEL> <book> <name>Herry Porter</name> <author>J.K Rolling</author> <publish_time>2058</publish_time> </book> <book> <name>三国演义</name> <author>罗贯中</author> <publish_time>1984</publish_time> </book> <book> <name>水浒传</name> <author>施耐庵</author> <publish_time>2501</publish_time> </book> <book> <name>红楼梦</name> <author>高雪琴</author> <publish_time>1865</publish_time> </book> </NOVEL> <MATH> <book> <name>圆周率</name> <author>猪无能</author> <publish_time>1869</publish_time> </book> <book> <name>勾股定理</name> <author>沙悟净</author> <publish_time>1875</publish_time> </book> <book> <name>相对论</name> <author>唐玄奘</author> <publish_time>1886</publish_time> </book> </MATH> </bookstore>
原生ajax练习-post&xml
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。