关于ajax异步访问数据的问题(ajax异步的原理)硬核推荐

随心笔谈9个月前发布 admin
213 00
🌐 经济型:买域名、轻量云服务器、用途:游戏 网站等 《腾讯云》特点:特价机便宜 适合初学者用 点我优惠购买
🚀 拓展型:买域名、轻量云服务器、用途:游戏 网站等 《阿里云》特点:中档服务器便宜 域名备案事多 点我优惠购买
🛡️ 稳定型:买域名、轻量云服务器、用途:游戏 网站等 《西部数码》 特点:比上两家略贵但是稳定性超好事也少 点我优惠购买

文章摘要

本文介绍了如何使用AJAX技术调用视频类型的笑贴资源。文章通过代码示例展示了如何在网页上实现AJAX调用,具体包括从API获取视频资源,并通过点击按钮触发加载过程。代码使用了jQuery和XMLHttpRequest,点击按钮后会在小窗口中显示笑话,自动重载页面后会隐藏该窗口。文章内容简明扼要,重点在于展示AJAX技术在视频资源加载中的应用。


<!DOCTYPE html>
<html lang=”zh-cn”>

<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<meta http-equiv=”X-UA-Compatible” content=”ie=edge”>
<title>ajax调用内涵段子</title>
<style>
video{
background-color: aquamarine;
}
</style>
<script src=”https://www.jb51.net/jquery-3.6.0.js”></script>
<script>
$(document).ready(function () {
xhttp=new XMLHttpRequest();
https=”https://api.apiopen.top/getJoke?page=1&count=2&type=video”;
xhttp.onreadystatechange=function(){
if(xhttp.readyState==4&&xhttp.status==200){
$(“h1”).html(JSON.parse(xhttp.responseText).result[0].text);
}
else{

}
}
$(“button”).click(function(){
xhttp.open(“GET”,https,true);
xhttp.send();
})
});
</script>
</head>
<button>点击获取</button>
<h1></h1>
<body>
</body>

</html>

© 版权声明

相关文章