一个对象
var xhr=new XMLHttpRequest();
两个方法
xhr.open('get|post',url,true|false);
xhr.send()
两个属性
xhr.responseText
xhr.responseXML
一个事件
xhr.onreadystatechange
Ajax部分，在本地服务器调用
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> </head> <body> <div class="aii"> <input type="button" value="获取"> <div class="cainame"></div> </div> <script> var cainame=document.querySelector('.cainame'); function aa(){ var xhr=new XMLHttpRequest(); var url="ss.xml"; xhr.open('get',url,true); xhr.onreadystatechange=function(){ if (4==this.readyState && 200==this.status) { var cai=this.responseXML; console.log(cai); var cname=cai.getElementsByTagName("name"); var tt=""; for (var i=0;i<cname.length;i++) { tt+=cname[i].childNodes[0].nodeValue+"<br>" }; console.log(tt); cainame.innerHTML=tt; } } xhr.send(); } document.querySelector('[type=button]').onclick=aa; </script> </body> </html>
xml文件ss.xml
<?xml version="1.0" encoding="utf-8"?> <menu> <caipu> <name>.赠送</name> <price>10.00</price> </caipu> <caipu> <name>赠送</name> <price>10.00</price> </caipu> <caipu> <name>赠送</name> <price>10.00</price> </caipu> <caipu> <name>赠送</name> <price>10.00</price> </caipu> <caipu> <name>赠送</name> <price>10.00</price> </caipu> <caipu> <name>赠送</name> <price>10.00</price> </caipu> <caipu> <name>赠送</name> <price>10.00</price> </caipu> <caipu> <name>赠送</name> <price>10.00</price> </caipu> <caipu> <name>赠送</name> <price>10.00</price> </caipu> <caipu> <name>赠送</name> <price>10.00</price> </caipu> </menu>