jquery发送ajax练习

@疯狂

2024-06-30 帮助7人

工具

HBuilder X

代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>通过ajax进行图片的提取和显示</title>
		<style>
			div{
				background-color: beige;
				color: red;
				font-size: 30px;
			}
		</style>
		
		<script src="js/jquery-1.12.4.min.js"></script>
		<script>
			$(function(){
				$.ajax({
					url:'https://image.百度.com/search/acjson?tn=resultjson\
					_com&logid=7217367652009448130&ipn=rj&ct=201326592&is=&f\
					p=result&fr=ala&word=图片&queryWord=�\
					�片&cl=2&lm=-1&ie=utf-8&oe=utf-8&adpicid=&st=&z\
					=&ic=&hd=&latest=&copyright=&s=&se=&tab=&width=&height=&\
					face=&istype=&qc=&nc=&expermode=&nojc=&isAsync=&pn=210&r\
					n=30&gsm=d2&1685454799580=',
					type:'GET',
					// dataType:'json',
					success:function(response){
						// console.log(response.data);
						// console.log(response.data.length);
						var data = response.data;
						var length = response.data.length - 1;
						console.log(data);
						// var div = $('div');
						// console.log(div);
						var insert = $('#insert');  // 为了页面有分隔，用 p 标签
						console.log(insert);
						for (var i=0;i<length;i  ) {
							console.log(data[i].thumbURL);
							var thumbURL = data[i].thumbURL;
							// div.append('<img src="https://blog.csdn.net/gxw11111111/article/details/132259706'   thumbURL   '" alt="">');
							insert.append('<img src="https://blog.csdn.net/gxw11111111/article/details/132259706'   thumbURL   '" height="200">');  // append是加载现有标签的下一级
						}
					},
					error:function(){
						console.log('请求失败');
					},
					async:true
				})
			})
		</script>
	</head>
	<body>
		<div>显示提取的图片：</div>
		<p id="insert"></p>
	</body>
</html>

运行结果

学新通

这篇好文章是转载于：学新通技术网

jquery发送ajax练习

工具

代码

运行结果

photoshop保存的图片太大微信发不了怎么办

word里面弄一个表格后上面的标题会跑到下面怎么办

photoshop扩展功能面板显示灰色怎么办

《学习通》视频自动暂停处理方法

TikTok加速器哪个好免费的TK加速器推荐

Android 11 保存文件到外部存储，并分享文件

微信公众号没有声音提示怎么办

excel下划线不显示怎么办

微信运动停用后别人还能看到步数吗

excel打印预览压线压字怎么办