jQuery中 $.get $.post $.getJSON的使用
阿新 • • 發佈：2020-12-07
技術標籤：jqueryjavascript
jQuery $.get() 方法
$.get() 方法通過 HTTP GET 請求從伺服器上請求資料。
語法：
$.get(URL,callback);
例項：
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GBK"> </head> <body> <button onclick="do_get()">獲取資料</button> <p id="txt"></p> </body> <script src="jquery-1.5.1.js"></script> <script> function do_get(){ //請求地址以及引數 var url="http://localhost:8080/yszdServer/entry?method=test_get&a=jquery_get"; $.get(url,function(data){ document.getElementById("txt").innerText=data; }); } </script> </html>
點選按鈕後：
$.post() 方法通過 HTTP POST 請求向伺服器提交資料。
語法:
$.post(URL,data,callback);
例項：
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GBK"> </head> <body> <button onclick="do_post()">獲取資料</button> <p id="txt"></p> </body> <script src="jquery-1.5.1.js"></script> <script> function do_post(){ //請求地址 var url="http://localhost:8080/yszdServer/entry?method=test_post"; //引數 $.post(url, {name:"jquery_post"}, function(res){ document.getElementById("txt").innerText=res; }); } </script> </html>
執行結果：
getJSON語法
$.getJSON(URL,data,callback);
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GBK"> </head> <body> <button onclick="do_getJson()">獲取資料</button> <p id="txt"></p> </body> <script src="jquery-1.5.1.js"></script> <script> function do_getJson(){ //請求地址 var url="http://localhost:8080/yszdServer/entry?method=jquery_getJSON"; //引數 $.getJSON( url, {name:"jquery_getJSON",r:Math.random()}, function(res){ document.getElementById("txt").innerText=res.name; } ); } </script> </html>
輸出：
