本文主要是給大家總結了一下Ajax的核心內容XMLHttpRequest的相關知識,十分的詳細,推薦給大家,需要的小伙伴參考下。
Ajax:即"Asynchronous JavaScript and XML"(非同步JavaScript和XML),一門綜合性的技術:運用JavaScript物件XMLHttpRequest進行非同步資料交換;JavaScript操作DOM實現動態效果;運用XHTML表達訊息;XML和XSLT操作資料。此篇文章重點在於使用XMLHttpRequest物件與伺服器端進行非同步資料交換。
使用方法
XMLHttpRequest五步驟使用法:
1.建立物件;
2.註冊回呼函數;
方法設定和伺服器互動的基本資訊;
4. 設定傳送的數據,開始和伺服器端互動;
5. 實現回呼函數。
由於每次應用XMLHttpRequest物件時,都要進行五步驟操作,因此,可將該物件的使用封裝為js檔案中,傳遞部分參數使用其方法就可以完成對應功能,實作如下:
//使用封裝方法人員只提供http的請求,url位址,數據,成功和失敗的回呼的方法
//1.定義XMLHttpRequest物件的建構方法
var MyXMLHttpRequest =function(){ var xmlhttprequest; if(window.XMLHttpRequest){ //IE7,IE8,FireFox,Mozillar,Safari,Opera //alert("IE7,IE8,FireFox,Mozillar,Safari,Opera"); xmlhttprequest = new XMLHttpRequest(); //解决浏览器在服务器端响应由于没有Text头的时候可能无法工作的问题 if(xmlhttprequest.overrideMimeType){ xmlhttprequest.overrideMimeType("text/xml"); } }else if(window.ActiveXObject){ //IE6,IE5.5,IE5 alert("IE6,IE5.5,IE5"); var activexName =["MSXML2.XMLHTTP","Microsoft.XMLHTTP"]; for (var n=0;n
擴充問題
## 1.瀏覽器快取 2.中文亂碼
3.跨網域存取
//解決快取的轉換:增加時間戳記
if(url.indexOf("?") >= 0 ){ url = url + "&t=" + (new Date())。valueOf(); } else { url = url + "?t=" + (new Date())。valueOf(); } //解决跨域的问题 if(url.indexOf("http://") >= 0) { url.replace("?","&"); url = "Proxy?url=" + url; }
/** * Handles the HTTP GET method. * * @param request servlet request * @param response servlet response * @throws ServletException if a servlet-specific error occurs * @throws IOException if an I/O error occurs */ @Override protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { //获取参数,最后得到请求url地址类似于:url = http://192.168…/AJAX/AJAXServer?aa=11&bb=22&cc=33 StringBuilder url = new StringBuilder(); url.append(request.getParameter("url")); //获取访问的跨域地址url = http://192.168…/AJAX/AJAXServer Enumeration enu = request.getParameterNames(); boolean flag = false; //定义标志变量,表示是否为拼接的第一个参数 while(enu.hasMoreElements()){ String paramName = (String) enu.nextElement(); if(!paramName.equals("url")){ String paramValue = request.getParameter(paramName); paramValue = URLEncoder.encode(paramValue,"utf-8"); if(!flag){ url.append("?")。append(paramName)。append("=")。append(paramValue); flag = true; } else { url.append("&")。append(paramName)。append("=")。append(paramValue); } } } response.setContentType("text/html;charset=utf-8"); PrintWriter out = response.getWriter(); if(url != null && url.length() > 0){ URL connectionUrl = new URL(url.toString()); BufferedReader reader = new BufferedReader(new InputStreamReader(connectionUrl.openStream(),"utf-8"));
JavaScript基於Ajax實作不刷新在網頁上動態顯示檔案內容
####
以上是Ajax核心XMLHttpRequest總結的詳細內容。更多資訊請關注PHP中文網其他相關文章!