Ajax学习整理笔记
生活随笔
收集整理的這篇文章主要介紹了
Ajax学习整理笔记
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
AJAX技術的出現使得javascript技術大火。不懂AJAX的同學百度一下,了解AJAX能做什么就可以了。
代碼:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Ajax</title> <script type="text/javascript">window.οnlοad=init;function init(){var btn = document.getElementById("getData");btn.onclick = getData;}function getData(){//利用ajax獲取數據步驟//1:創建XMLHttpRequest對象,在IE瀏覽器中版本低于7的情況獲取的這個對象不是XMLHttpRequest,我們可以用一個工程的函數來實現(屏蔽不同瀏覽器之間的對象的創建)var xhr = createXMLHttpRequest();alert(xhr);//2:檢測XMLHttpRequest對象的狀態,在合適的地方處理//通過open方法確定要訪問的頁面1個參數請求類型,2提交路勁,3個參數是是否異步xhr.open("GET","AjaxServlet",true);//在onreadystatechange事件中處理請求xhr.onreadystatechange = function(){//onreadystatechange在每個階段都進行響應,在狀態等于4的時候請求結束并且state=200if (xhr.readState == 4 && xhr.status == 200) {//獲取相應的文本信息通過xhr的resposeText可以獲取文本信息,包括xml的標簽//通過responseXML可以獲取xml的信息,只能xml對象document.getElementById("saveData").innerHTML = xhr.responseText;}}//3:發送請求,send函數可以傳入相應的參數,這個參數必須是post請求的方式才有效,get請求直接在請求地址中拼接比如send("id=XXX & name=XXX")xhr.send();}function createXMLHttpRequest(){if (window.ActiveXObject) {//針對ie5,6return new ActiveXObject("Microsoft.XMLHTTP");} else if (window.XMLHttpRequest){//其他主流瀏覽器return new XMLHttpRequest();}else {alert("你使用的瀏覽器不支持XMLHttpRequest");return null;}}</script> </head> <body><input type="button" value="獲取數據" id= "getData"><div id="saveData"></div></body> </html>后臺代碼: package com.study.servlet;import java.io.IOException; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse;public class AjaxServlet extends HttpServlet {private static final long serialVersionUID = 1L;protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {this.doPost(request, response);}protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {System.out.println("ajax come");response.getWriter().write("AJAX");}}
?
轉載于:https://www.cnblogs.com/airycode/p/4823083.html
總結
以上是生活随笔為你收集整理的Ajax学习整理笔记的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 图集cancelButtonIndex,
- 下一篇: 一个汽车站有AB两路车,a路车每十分钟发