原生的js写Ajax请求

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了原生的js写Ajax请求相关的知识,希望对你有一定的参考价值。

1:界面

界面就一个按钮 和一个用来显示服务器返回来的数据的div

技术分享图片


2:js实现Ajax

注意:我这里在创建XMLHttpRequest对象,没有用兼容性写法。实际中,需要用兼容性写法。

7步完成  第8步,如果需要处理数据,就处理数据。

技术分享图片

3:后台的数据是   json格式的数据 ,是一个数组。

技术分享图片

4:效果

点击按钮出现如下效果,并且页面不会刷新。

技术分享图片

以上是关于原生的js写Ajax请求的主要内容,如果未能解决你的问题,请参考以下文章

JS原生Ajax请求

原生js写ajax-demo

原生JS发送Ajax请求

原生js 封装ajax请求超详细

用原生JavaScript写AJAX

原生JS实现ajax与ajax的跨域请求