jQuery Load() 方法是 jQuery 庫中一個十分實用的功能,它能夠讓我們以異步的方式向服務器發送請求,從而加載查詢到的指定的 HTML 內容,最終實現不刷新頁面就能動態加載 頁面內容的效果。
$(selector).load(url,data,function(response,status,xhr){ //執行回調函數 });
jQuery load() 方法的基本語法如上所示,其中,selector
參數是要加載內容的 HTML 元素選擇器,url
參數是要從服務器加載內容的地址,data
參數是可選的,它是發送到服務器的數據,response
參數是包含被請求頁面的內容的返回數據,status
參數表示響應狀態(如 "success" 或 "error"),xhr
參數是 XMLHttpRequest 對象。
在實現異步加載內容的過程中,jQuery 還提供了幾個其他額外的選項:
1. 可以接收文本、HTML、JSON、XML 和腳本格式的返回數據,例如: $("#div1").load("demo_test.txt"); // 加載純文本格式的數據 $("#div2").load("demo_test.html #p1"); // 加載 HTML 格式的數據 $("#div3").load("demo_test.xml"); // 加載 XML 格式的數據 $("#div4").load("demo_test.json", function(responseTxt,statusTxt,xhr){ if(statusTxt=="success") alert("加載成功"); if(statusTxt=="error") alert("加載失敗: "+xhr.status+": "+xhr.statusText); }); // 加載 JSON 格式的數據,同時如果加載成功,則彈出提示信息,如果加載失敗,則彈出錯誤狀態碼和錯誤信息 2. 可以指定頁面的元素并僅加載其中特定的部分,例如: $("#div5").load("demo_test.html #p1"); // 僅加載 id 為 p1 的元素 3. 可以向服務器發送數據,例如: $("#div6").load("demo_test.php",{name:"John",age:30}); // 向服務器發送數據,同時還將數據作為參數發送到想要請求的地址
綜上所述,jQuery load() 方法是一個非常實用的功能,它可以將不同格式的內容一次性異步加載到特定的 HTML 元素中,極大地提高了頁面的加載性能和交互效果。