$.ajax() 方法案例

【代码】$.ajax() 方法案例。

追丰少年

78202人浏览 · 2022-09-15 18:59:03

追丰少年 · 2022-09-15 18:59:03 发布

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
	<script type="text/javascript" src="js/jquery-3.5.1.js" ></script>
	<script>
		$(function(){  // 创建一个页面就绪函数，其用途是在页面加载完毕后，执行这个function里面的代码；
			$.ajax({
				"url":"/ajax/news_list",
				"type":"post",
				"data":"t=tiobe",
				"dataType":"json",  // 在JavaScript中json的key可以不加引号，但是为了严谨和防止混乱，还是加上引号吧；
				"success":function(json){
					console.log(json);
					for(var i=0;i<json.length;i++){
						 // append()的作用可以将append()中的html代码段追加到div的最后
						$("#container").append("<h1>"+json[i].title+"</h1>");  
					}
				},
				"error":function(xmlhttp,errorText){     // xmlhttp和errorText哪儿来的？？？
					console.log(xmlhttp);
					console.log(errorText);
					if(xmlhttp.status == "405"){
						alert("无效的请求方式");
					}else if(xmlhttp.status == "404"){
						alert("未找到url资源");
					}else if(xmlhttp.status == "500"){
						alert("服务器内部错误");
					}else{
						alert("其他异常");
					}
					
				}
			})
			
		});
	</script>
</head>
<body>
	<div id="container"></div>
</body>
</html>