当前位置: 首页 > news >正文

ajax是什么?咋实现的

创建交互式网页应用的网页开发技术

 再不重新加载整个网页的前提下,与服务器交换数据并且更新部分内容

简单来说就是无页面刷新的数据交互

通过创建xmlhttprequest对象向服务器异步发送请求从而获取数据,然后操作dom更新内容

 1,创建xmlhttprequest对象xmh

 2,通过xmh里面的open与服务器创建链接

 3,构建请求所需的数据,通过send发送给服务器

 4,通过onreadystatechange事件监听服务器的状态

 5,接受数据,并且处理后把数据更新到页面上

// get 请求

// 创建 xhr 对象
const xhr = new XMLHttpRequest();
// XMLHttpRequest.open() 方法初始化一个请求
// 原始API:xhr.open(method, url, async);
// method:要是用的HTTP方法,url:请求的主体,async(可选):false为同步,true为异步,默认为同步
xhr.open('GET', '/api', false);
// 只要 readyState 属性发生变化,就会调用相应的处理函数。
xhr.onreadystatechange = function () {
    // 这里的函数异步执行,可参考之前 JS 基础 中的异步模块
    if (xhr.readyState === 4) {
        if (xhr.status === 200) {
            // 从服务器端返回文本。
            alert(xhr.responseText);
        };
    };
};
// 默认要设置,因为get请求,不需要发送数据
// XMLHttpRequest.send()方法用于发送 HTTP 请求
xhr.send(null);
 

http://www.lryc.cn/news/3876.html

相关文章:

  • AI推理计算框架中的内存优化
  • C语言学习小结(1)——初认识C语言
  • 30分钟吃掉wandb可视化自动调参
  • 【8】AMBA_SOC项目自学IC验证项目-仿真平台脚本使用讲解
  • 智慧水务未来技术发展方向预测探讨
  • 数据结构 | 栈与队列
  • Redux 源码分析
  • 第五十二章 BFS进阶(二)——双向广搜
  • 业务建模题
  • 电子秤专用模拟数字(AD)转换器芯片HX711介绍
  • 微服务 RocketMQ-延时消息 消息过滤 管控台搜索问题
  • js发送邮件(node.js)
  • English Learning - Day58 一周高频问题汇总 2023.2.12 周日
  • 【微电网】基于风光储能和需求响应的微电网日前经济调度(Python代码实现)
  • 四种方式的MySQL安装
  • 软考高级信息系统项目管理师系列之九:项目范围管理
  • 【项目精选】javaEE健康管理系统(论文+开题报告+答辩PPT+源代码+数据库+讲解视频)
  • ctfshow nodejs
  • 无线传感器原理及方法|重点理论知识|2021年19级|期末考试
  • 带你写出符合 Promise/A+ 规范 Promise 的源码
  • 回流与重绘
  • openpyxl表格的简单实用
  • 【寒假day4】leetcode刷题
  • 【竞赛题】6355. 统计公平数对的数目
  • Redis集群搭建(主从、哨兵、分片)
  • Dart语法基础补充
  • Nginx - 深入理解nginx的处理请求、进程关系和配置文件重载
  • 华为OD机试 - 服务依赖(Python)| 真题含思路
  • html的表单标签(form)
  • 手把手教你部署ruoyi前后端分离版本