资讯专栏INFORMATION COLUMN

上云采购季！| 爆款云服务器低至4.6元/月，首单享0.9折

免费试用
首页/文章专栏/AJAX

AJAX

孙淑建 / 1215人阅读

摘要：并且可以使用获取元素的，来获取的元素，例如修改后的如下所示，新增内容和注释如

可以如何发送请求

用

可以发请求，但是会刷新页面或新开页面

用只可以发 get 请求，但是也会刷新页面或新开页面

用只可以发 get 请求，但是只能以图片的形式展示

用只可以发 get 请求，但是只能以 CSS、favicon 的形式展示

用

main.js :

myButton.addEventListener=("click",function(e){
    var request= new XMLHttpRequest();         //新建请求
    request.onreadystatuschange=function(){    //当请求的状态有变化时，打印出状态码
        console.log(request.readyStatus);
    }
    request.open("GET","/xxx");                //初始化,GET 方法，/xxx 路径
    request.send();                            //发送请求
})

后端代码 :

}else if(path==="/xxx"){
    response.statusCode = 200
    response.setHeader("Content-Type", "text/xml;charset=utf-8")
    response.write(`
        //xml
        
          Tove
          Jani
          Reminder
          Don"t forget me this weekend!
        
    `)
    response.end()
}

效果 ：
当点击 点我 按钮时，首先，新建一个XMLHttpRequest请求；其次，使用 GET 方法请求到 /xxx；最后，发送请求。

当服务器收到请求了 /xxx 路径，然后，就返回了一串格式符合 XML 的字符串

并且，当请求和响应进行到各个状态时，都会打印出它的状态码
（状态码请参考：https://developer.mozilla.org...）

version2.0-获取xml

除了可以获取状态码、在浏览器控制台获取服务器返回的XML字符串外，还可以将XML字符串转换为XML。
并且可以使用DOM获取元素的API，来获取XML的元素，例如getElementByTagNames...
修改后的 main.js 如下所示，新增内容和注释如

服务器托管 云服务器 ajax() ajax? ajax _AJAX

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/97804.html

相关文章

  • ajax与jsonp一点基础整理

    摘要：之所以不能跨域其实是因为受到同源策略的限制，只能让它访问同源下的数据，不能访问不同源下的数据同源策略每个网站只能读取同一来源的数据，这里的同一来源指的是主机名域名协议和端口号的组合。 一、Ajax的概念 Ajax是一种技术方案，但并不是一种新技术。它依赖的是现有的CSS/HTML/Javascript，而其中最核心的依赖是浏览器提供的XMLHttpRequest对象，是这个对象使得浏...

    tomlingtm 评论0 收藏0

  • 深入浅出Ajax

    摘要：在接收响应期间持续不断地触发。在请求发生错误时触发。在通信完成或者触发或事件后触发。已经接收到部分响应数据。基于标准被广泛支持。破坏程序的异常处理机制。 原文（我的GitHub）：https://github.com/liangfengbo/frontend-ability/issues/1 学习大纲 理解Ajax的工作原理 Ajax核心-XMLHttpRequest对象 封装Aja...

    megatron 评论0 收藏0

  • 再也不学AJAX了！（一）AJAX概述

    摘要：需要注意的是，并不是的替代品，两者各自有其适应的场景。但为了方便交流，我们通常将获取资源的一方称为客户端主要的工具是浏览器，而将派发资源的一方称为服务端又称为服务器。它可以帮助我们为之后概念细节的学习打下良好基础。 再也不学AJAX了是一个与AJAX主题相关的文章系列，包含以下三个部分的内容： AJAX概述：主要回答AJAX是什么这个问题； 使用AJAX：介绍如何通过JavaSc...

    neu 评论0 收藏0

  • ajax入门

    摘要：基于标准被广泛支持。这样的类最初是在中作为一个名为的对象引入的。请求还没有被发送。当为，这个属性返回目前已经接收的响应部分。由服务器返回的状态代码，如表示成功，而表示错误。方法取消当前响应，关闭连接并且结束任何未决的网络活动。 前言 总括： 本文讲解了ajax的历史，工作原理以及优缺点，对XMLHttpRequest对象进行了详细的讲解，并使用原生js实现了一个ajax对象以方便日常开...

    Fundebug 评论0 收藏0

  • Web前端-Ajax基础技术(下)

    摘要：前端基础技术下你要明白是什么，怎么使用，程序是将信息放入公共的服务器，让所有网络用户可以通过浏览器进行访问。获取字符串形式的响应数据，获取形式的响应数据。基础回顾原理是借助标签发送跨域请求的技巧。 Web前端-Ajax基础技术(下) 你要明白ajax是什么，怎么使用？ ajax，web程序是将信息放入公共的服务器，让所有网络用户可以通过浏览器进行访问。 浏览器发送请求，获取服务器的数据：...

    赵连江 评论0 收藏0

  • AJAX-Cache：一款好用的Ajax缓存插件

    摘要：是一款缓存插件，可以为方法扩展缓存功能。缓存清理插件本身会自动清理过期缓存对于不想继续使用缓存的接口可以为方法传入清理当前接口的缓存并返回最新数据也可以调用清理所有插件产生的缓存。 原文链接 AJAX-Cache是什么 Ajax是前端开发必不可少的数据获取手段，在频繁的异步请求业务中，我们往往需要利用缓存提升界面响应速度，减少网络资源占用。AJAX-Cache是一款jQuery缓存插件...

    didikee 评论0 收藏0

发表评论

登陆后可评论

0条评论

孙淑建

男|高级讲师
我要私信

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<