返回顶部
首页 > 资讯 > 后端开发 > 其他教程 >关于ajax异步访问数据的问题
  • 566
分享到

关于ajax异步访问数据的问题

2024-04-02 19:04:59 566人浏览 泡泡鱼
摘要

在js中,处理数据固然很快,sososo就能完成所有的数据处理,我们似乎不需要使用异步传输数据 跨洋数据传输就出现了问题,一来2s过去了一回2s过去了,这对于访问者来说,这就是卡 再

js中,处理数据固然很快,sososo就能完成所有的数据处理,我们似乎不需要使用异步传输数据

跨洋数据传输就出现了问题,一来2s过去了一回2s过去了,这对于访问者来说,这就是卡

再者 我输入了密码 提示密码错误 于是要重新输入,返回了一个网页 这时候输入的数据就会被清空,非常让人抓狂。

为了解决这个问题ajax孕育而生

Ajax全名Asynchronous javascript and XML 名为异步的JavaScript和XML

Ajax使用方式非常简单

1.创建实例 xHttp = new XMLHttpRequest( )

2.发送文件 Xhttp.open("GET","地址","true/false")

3.定义在发送文件后所获取的数据


xhttp.onreadystatechange = function(){}

在完全传输完成的时候

xhttp.readyState就会等于4
xhttp.status就会等于200
这个时候就能在
xhttp.responseText中获取到数据
4.处理数据 
xhttp.responseText获得的数据为字符串
要将其变为字典对象
JSON.parse(xhttp.responseText)


<!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="../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>

到此这篇关于ajax异步访问数据的文章就介绍到这了,更多相关ajax异步访问数据内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!

--结束END--

本文标题: 关于ajax异步访问数据的问题

本文链接: https://lsjlt.com/news/133849.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • 关于ajax异步访问数据的问题
    在js中,处理数据固然很快,sososo就能完成所有的数据处理,我们似乎不需要使用异步传输数据 跨洋数据传输就出现了问题,一来2s过去了一回2s过去了,这对于访问者来说,这就是卡 再...
    99+
    2024-04-02
  • 关于reactuseState更新异步问题
    目录react useState更新异步记useState异步更新小坑问题点react useState更新异步 当我们使用react中useState这个hook时候,如下 con...
    99+
    2022-11-13
    react useState更新异步 react异步更新 react useState异步
  • 关于SpringBoot整合Canal数据同步的问题
    目录1、CentOS7编译安装MySQL5.7.242、Mysql设置binLog配置3、Linux下载安装Canal服务4、Boot项目中引入依赖5 、修改properties配置...
    99+
    2024-04-02
  • 关于Redis未授权访问的问题
    目录漏洞原理利用条件漏洞危害漏洞复现搭建测试环境攻击机Kali 2021.1利用redis写入webshell利用redis反弹shell利用redis写入ssh公钥总结漏洞原理 R...
    99+
    2024-04-02
  • 关于React中setState同步或异步问题的理解
    目录1. setState同步?异步? 2. 表现为异步 1. React 合成事件 2. 生命周期函数 3. 表现为同步 1. 原生事件 2. setTimeout 4. setS...
    99+
    2024-04-02
  • Vue关于访问外链失败的问题
    目录Vue访问外链失败什么是 referrer ?隐私安全Vue打开一个外部连接总结Vue访问外链失败 在公司项目中,点击跳转外部链接时,发现跳转失败,但是在浏览器访问可以直接访问,...
    99+
    2023-03-11
    Vue访问外链失败 Vue访问外链 Vue外链访问
  • 关于IDEA关联数据库的问题
    IDEA关联数据库 首先打开一个IDEA工程,在右边可以看到Database一个按钮,点击。 如上这个界面,点击加号 选择Data Source,选择数据库类型,我这里使用的是M...
    99+
    2024-04-02
  • 关于MongoDB同步延迟问题
    当你的用户抱怨修改过的信息不改变,删除掉的数据还在显示,你掐指一算,估计是数据库主从不同步。与其他提供数据同步的数据库一样,MongoDB也会遇到同步延迟的问题,在MongoDB的ReplicaOr pro...
    99+
    2024-04-02
  • 关于MeasureString的参数问题
    MeasureString方法是用来测量指定字符串在指定字体和大小下的大小的。它的参数有以下几个:1. text:要测量大小的字符串...
    99+
    2023-08-08
    MeasureString
  • 关于idea中Java Web项目的访问路径问题
    说明 这里只以 servlet 为例,没有涉及到框架,但其实路径的基本原理和框架的关系不大,所以学了框架的同学如果对路径有疑惑的也可以阅读此文 项目结构 在 idea 中新建一个 J...
    99+
    2024-04-02
  • 关于两次访问接口的sessionid不一致问题
    在测试验证邮箱、注册逻辑时,出现验证码错误的问题。验证码是存放在session内的,在排除了逻辑代码的问题后,检查出这两次访问接口的sessionid并不一致,而在swagger测试接口时是一致的。...
    99+
    2023-09-28
    ajax javascript 前端 java 服务器
  • 关于Docker部署postgresql数据库的问题
    环境 Centos-7 Postgresql-10 docker-19 yum加载Postgresql yum install https://download.postgresql...
    99+
    2024-04-02
  • 关于mybatis resulttype 返回值异常的问题
    目录mybatisresulttype返回值异常例如:resulttype="student"但是当中有些字段为空例如:数据库字段为:s_name实体类字段为namemybatisresultType="map"的常见问题一、map的key...
    99+
    2015-02-25
    mybatis resulttype 返回值异常 resulttype返回值
  • Ajax怎么跨域访问XML数据
    这篇文章主要介绍“Ajax怎么跨域访问XML数据”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“Ajax怎么跨域访问XML数据”文章能帮助大家解决问题。 XML数据...
    99+
    2024-04-02
  • 关于SpringBoot mysql数据库时区问题
    寻找原因 后端开发中常见的几个时区设置 第一个设置点配置文件 spring.jackson.time-zone 第二个设置点 高版本SpringBoot版本 mysql-connec...
    99+
    2024-04-02
  • Vue关于访问外链失败的问题如何解决
    这篇文章主要介绍了Vue关于访问外链失败的问题如何解决的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇Vue关于访问外链失败的问题如何解决文章都会有所收获,下面我们一起来看看吧。Vue访问外链失败在公司项目中,点...
    99+
    2023-07-05
  • 关于mongoDB数据库添加账号的问题
    1. 以管理员运行powershell 2. mongo 连接服务器 (需要开启服务器) // 开启mongodb 服务 net start mongodb // 连接数据库 mon...
    99+
    2024-04-02
  • 关于DVWA创建数据库遇到的问题
    在DVWA创建数据库时相比大家可能会遇到意想不到的问题,接下来我来说明一下我自己时遇到的问题及解决方法,希望给大家提供一些参考。 问题如下: “Could not connect to the MySQL service. Pleas...
    99+
    2023-09-04
    mysql Powered by 金山文档
  • 关于dataguard出现问题的检查步骤
    一般情况dataguard出现问题都会在alert日志中看到相关错误信息,或者执行SQL语句命令 select error  from   v$ archive_...
    99+
    2024-04-02
  • Java11 中基于嵌套关系的访问控制优化问题
    目录Java11 之前的实现方式技术债务Java11 中的实现Nestmate 新增的 APIgetNestHostgetNestMembersisNestmateOf后续的改进 你...
    99+
    2024-04-02
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作