其他分享
首页 > 其他分享> > 025-jQuery AJAX-$.get()和$.post()方法

025-jQuery AJAX-$.get()和$.post()方法

作者:互联网

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
		<script>
			$(document).ready(function(){
				$("#btn1").click(function(){
					$.get("try/ajax/demo_test.txt",
					function(data, status){
						alert("数据: "+data+"\n状态: "+status);
					});
					
				});
				$("#btn2").click(function(){
					$.post("/try/ajax/demo_test.php",{
						name:"菜鸟教程",
						url:"http://www.runoob.com"
					},
					function(data, status){
						alert("数据: \n"+data+"\n状态: "+status);
					});
				});
			});
		</script>
	</head>
	<!--
	jQuery-AJAX get()和post()方法
		jQuery get()和post()方法用于HTTP GET或POST请求从服务器请求数据
	HTTP请求:GET vs. POST
		两种在客户端和服务器端进行请求-响应的常用方法是:GET和POST
		- GET-从指定的资源请求数据
		- POST-向指定的资源提交要处理的数据
		GET基本用于从服务器获得(取回)数据.注释:GET方法可能返回缓存数据
	jQuery $.get()方法
		$.get()方法通过HTTP GET请求从服务器上请求数据
		语法
		$.get(URL,callback);
		必需的URL参数规定您希望请求的URL
		可选的callback参数是请求成功之后执行的函数名
		下面的例子使用$.get()方法从服务器上的一个中取回数据
		$("#btn1").click(function(){
			$.get("try/ajax/demo_test.txt",
			function(data, status){
				alert("数据: "+data+"\n状态: "+status);
			});
		});
		$.get()的第一个参数是我们希望请求的URL("demo_test.txt").
		第二个参数是回调函数.
		第一个回调参数存有被请求页面的内容.第二个回调参数存在请求的状态
	jQuery $.post()方法
		$.post()方法通过HTTP POST请求向服务器提交数据
		语法:
		$.post(URL,data,callback);
		必需的URL参数规定您希望请求的URL
		可选的data参数规定连同请求发送的数据
		可选的callback参数是请求成功后执行的函数名.
		下面的例子使用$.post()连同请求一起发送数据
		$("#btn2").click(function(){
			$.post("/try/ajax/demo_test.php",{
				name:"菜鸟教程",
				url:"http://www.runoob.com"
			},
			function(data, status){
				alert("数据: \n"+data+"\n状态: "+status);
			});
		});
		$.post()的第一个参数是我们希望请求的URL("demo_test_post.php")
		然后我们连同请求(name和url)一起发送数据
		"demo_test_post.php"中的php脚本读取这些参数,对他们处理,然后返回结果
		第三个参数是回调函数.第一个回调函数存有被请求页面的内容,而第二个参数存有请求的状态
	
		
	-->
	<body>
		<button id="btn1">发送一个HTTP GET请求并返回结果</button>
		<button id="btn2">发送一个HTTP POST请求页面并获取返回内容</button>
	</body>
</html>

标签:jQuery,status,请求,get,function,demo,025,post,data
来源: https://blog.csdn.net/weixin_43404791/article/details/122703462