AJAX-简单示例
一個簡單的AJAX示例
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>AJAX</title><script>function getXMLHttpRequest() {try {try{return new ActiveXObject("Microsoft.XMLHTTP");}catch(e){return new ActiveXObject("Msxml2.XMLHTTP");}} catch(e) {return new XMLHttpRequest();}}function responseAjax(){if(myRequest.readyState ==4){if(myRequest.status == 200){alert("The server said:"+myRequest.responseText);}else{alert("error:"+myRequest.statusText);}}}var myRequest = getXMLHttpRequest();function callAjax(){var lastname = 'Numb';var url="http://123.206.17.200/hello.php";myRequest.open('GET',url)myRequest.onreadystatechange = responseAjax;myRequest.send()}</script> </head> <body><button id="btn" onclick="callAjax()">按鈕</button> </body> </html>頁面很簡單,只有一個button,添加了一個onclick事件,有三個函數,分別是
getXMLHttpRequest():針對不同瀏覽器,獲取XMLHttpRequest實例
responseAjax():回調函數,當瀏覽器請求完成后執行,返回服務器返回的數據,responseText
callAjax():發送服務器請求,open()和send()方法
假設服務器用如下的一個簡單PHP文件:
如果XMLHttpRequest成功調用了這個文件,responseText屬性就會發哦韓字符串”Hello Ajax caller”,如下圖
注意:要訪問的必須是同域下文件,同源策略規定,瀏覽器的ajax只能訪問跟它的HTML頁面同源(相同域名或IP)的資源。
什么事跨域訪問:在A網站中,我們希望使用Ajax來獲得B網站中的特定內容。如果A網站與B網站不在同一個域中,那么就出現了跨域訪問問題。你可以理解為兩個域名之間不能跨過域名來發送請求或者請求數據,否則就是不安全的。
跨域訪問可用CORS,以后更新
總結
- 上一篇: 微信小程序开发-入门基础
- 下一篇: AJAX-prototype.js实现A