提示：以下是本篇文章正文内容，下面案例可供参考

一、ajax是什么？

ajax可以与后台服务器进行数据交换，Ajax可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

二. 使用步骤

1.实例化请求对象

 var http=new XMLHttpRequest ();

2.建立服务器链接

http.open('POST', 'http://127.0.0.1:8000/', true);

3.监听服务器响应

 http.onreadystatechange =function(){//服务器响应//5.响应成功，传递参数//可以获取数据//服务器返回是jsonconsole.log(http.responseText)}

4.发送请求

 http.send();

全部代码如下

<!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>Document</title>
</head>
<body></body>
<script>//1.实例化请求对象var http=new XMLHttpRequest ();//2.建立服务器链接//1.请求方式   get post//2.url    服务器接口//3.async     指当前请求是同步还是异步     true/false//同步：请求完成后去执行后续代码（等待请求完成 ）        false//异步：请求和后续代码同时执行（不需等待，所有代码同时执行）   true//4.5.  用户名和密码，（为了安全）http.open('POST', 'http://127.0.0.1:8000/', true);/*3.监听服务器响应   1 2 3 4   服务器响应状态    404（页面丢失  200（成功  500（服务器报错*/http.onreadystatechange =function(){//服务器响应//5.响应成功，传递参数//可以获取数据//服务器返回是jsonconsole.log(http.responseText)}//4.发送请求//send方法的参数取决于请求方式    get post//get   url+"?id=1&name=111"//post   send()    方法，传递参数http.send();</script>
</html>

原生ajax请求流程相关推荐

原生Ajax请求流程：同步请求、异步请求
Ajax 异步无刷新技术原生Ajax的实现流程得到XMLHttpRequest对象 - var xhr = new XMLHttpRequest(); 打开请求 - xhr.open(method ...
原生ajax请求及readyState的几种状态
原生ajax请求写法: var http = new XMLHttpRequest();http.open('get','./package.json');http.onreadystatechang ...
原生ajax请求的封装
原生ajax请求的封装原生ajax请求分为四步: 1.创建请求对象判断浏览器的兼容问题 ie浏览器:window.ActiveXObject 常用浏览器:window.XMLHttpRequest ...
原生ajax请求时出现xhr.status==0及POST请求无响应问题
用原生ajax请求时发现xhr.status == 0,于是找了好久,竟然发现是绑定事件的元素不是我点击的元素.参考以下资源 AJAX问题之XMLHttpRequest status = 0 xhr. ...
理解ajax技术，封装原生 ajax请求
一.Ajax 概述 Ajax 是 Asynchronous Javascript And XML 的简写 Ajax是一门技术,并不是一门语言使用XHTML+CSS来标准化呈现使用XML和XSLT进 ...
前端接收pdf文件_原生ajax请求获取pdf文件流本地下载（支持谷歌IE）
项目中要实现本地下载pdf文件,ajax请求获取到文件全路径,如上,a标签href属性赋值跳转,在iframe里面,谷歌浏览器被阻止下载.那只能另想办法.经过几天的摸索和后台调整接口数据流,终于解决. ...
javscript之原生ajax请求的封装
目录 ajax系列 2:完美版本的ajax请求 ajax系列 1:formateUrl 格式化url函数作用:就是在ajax发起请求的,需要配置url路径也就是格式化url 所以里面的参数大概有两 ...
发送原生ajax请求的步骤
需要考虑下浏览器的兼容性 <script>/* ajax请求数据的步骤:1.创建ajax对象2.配置请求方式和请求地址以及是否异步请求3.浏览器向服务器发送请求4.服务器接受请求5.判断请 ...
原生ajax请求并渲染,原生js的ajax数据渲染
ajax应用不只是页面功能的提升,也是性能优化的一种方式. 兼容这块的话就是其ajax对象,在ie和其他浏览器的不同,那么现在基本上w3c已经给出了兼容的写法 var xmlhttp; if(wind ...
详解原生AJAX请求demo（兼容IE5/6）
function createXHR(){ // 检测原生XHR对象是否存在if ( window.XMLHpptRequest ){// 如果存在就返回新实例return new XMLHpptRe ...

原生ajax请求流程

一、ajax是什么？

二. 使用步骤

全部代码如下

原生ajax请求流程相关推荐

最新文章

热门文章