![](https://img-blog.csdnimg.cn/20201014180756754.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Ajax
文章平均质量分 58
多读书多看报!
~
展开
-
留言板主要代码展示
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D.原创 2021-05-04 14:42:14 · 3071 阅读 · 1 评论 -
了解Ajax响应数据的渲染及模板引擎
Ajax的响应数据格式有: XML,一种数据描述的手段,缺点:数据冗余太多。 JSON(JavaScript Object Notation,JavaScript)对象表示法,数据描述的手段,类似于JavaScript字面量方式。服务端采用JSON格式返回数据,客户端按照JSON格式解析数据。 这些数据协议都是Ajax在请求过程中会用到的,所以当服务器发出某种格式的数据时,客户端就可以采用JavaScript相应的方法解析这种格式。 JSON Server json-server 是一个Nod原创 2021-05-04 11:51:30 · 246 阅读 · 0 评论 -
理解跨域
了解跨域前,先了解同源策略 同源策略 同源策略是浏览器的一种安全策略,所谓同源是指域名、协议、端口完全相同。若只有目录不同则仍是同源。 在同源策略下,只有同源的地址才可以相互通过Ajax的方式请求。 在同源策略下,浏览器不允许Ajax跨域获取服务器数据。 同源或者不同源说的是两个地址之间的关系,不同源地址之间请求称为——跨域。 跨域解决方案 JSONP json with padding,是一种借助于script标签发送跨域请求的技巧。原理就是在客户端借助script标签请求服务器的一个地址。原创 2021-05-04 11:37:53 · 107 阅读 · 0 评论 -
跨域代码练习——模拟百度搜索
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do.原创 2021-05-04 11:32:28 · 130 阅读 · 0 评论 -
Ajax常用封装库——Axios
Axios 是目前应用最为广泛的 AJAX 封装库 Axios的特性有: 从浏览器中创建 XMLHttpRequests 从 node.js 创建 http 请求 支持 Promise API 拦截请求和响应 转换请求数据和响应数据 取消请求 自动转换 JSON 数据 客户端支持防御 XSRF 使用axios时,需要通过使用script标签引入:https://unpkg.com/axios/dist/axios.min.js axios的中文网链接:Axios中文网 Axios API 向axio原创 2021-05-04 10:52:58 · 274 阅读 · 0 评论 -
jQuery中Ajax的使用
在使用原生Ajax发送一个请求时,过程多少有点繁琐,jQuery中对于Ajax请求有它自己的封装好的函数,使用起来分方便。 在jQuery中有专门的Ajax封装,具体参照JQuery-Ajax参考手册网址 这里用一段练习代码展示下使用方法: //使用要引入jQuery文件 <script src="../jq/jquery-1.12.4.min.js"></script> $.ajax({ url:"http://localhost:3000/users",原创 2021-05-04 10:20:39 · 81 阅读 · 0 评论 -
如何封装一个Ajax请求函数
如何封装Ajax函数 一个Ajax函数: // 一个Ajax函数 var xhr = null; if(window.XMLHttpRequest){ xhr = new XMLHttpRequest; }else{ xhr = new ActiveXObject("Microsoft.XMLHTTP"); } xhr.open("GET","https://jsonplaceholder.typicode.com/users"); xhr.send(null); xhr.onreadystat原创 2021-05-04 10:03:48 · 452 阅读 · 0 评论 -
了解AJAX及AJAX如何发送请求
由于JavaScript能力有限,它所提供的API都只停留在单机阶段。这样会造成一些功能无法实现,如:无法实现用户登录时,用户在输入用户账户时显示用户对应的头像;无法实现用户注册时,用户输入账号或用户名时提示是否存在;无法实现在留言板功能看到最新的用户留言。 上述这些问题的共同点就是:数据存放在服务端,无法通过已知的API获取。而Ajax的出现就解决了这些问题。 已知的发送请求的方式,就是在地址栏输入地址,回车刷新,对特定的元素的href或src属性,表单的提交,使用ajax通过JavaScri原创 2021-05-04 09:40:55 · 156 阅读 · 0 评论