javascript实现原生ajax的几种方法介绍

标签:新闻动态    日期:2017-11-03 09:34    录入:汇盛国际平台    浏览:

  

[javascript,原生ajax]javascript实现原生ajax的几种方法介绍

  

自从javascript有了各种框架之后,比如jquery,使用ajax已经变的相当简单了。但有时候为了追求简洁,可能项目中不需要加载jquery这种庞大的js插件。但又要使用到ajax这种功能该如何办呢?下面和大家分享几种利用javascript实现原生ajax的方法。

  
  
实现ajax之前必须要创建一个 XMLHttpRequest 对象。如果不支持创建该对象的浏览器,则需要创建 ActiveXObject,具体方法如下:  
代码如下:

  
var xmlHttp;  
function createxmlHttpRequest() {  
if (window.ActiveXObject) {  
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");  
} else if (window.XMLHttpRequest) {  
xmlHttp=new XMLHttpRequest();  
}  
  
(1)下面使用上面创建的xmlHttp实现最简单的ajax get请求:  
代码如下:
  
function doGet(url){  
// 注意在传参数值的时候最好使用encodeURI处理一下,以防出现乱码  
createxmlHttpRequest();  
xmlHttp.open("GET",url);  
xmlHttp.send(null);  
xmlHttp.onreadystatechange = function() {  
if ((xmlHttp.readyState == 4) && (xmlHttp.status == 200)) {  
alert('success');  
} else {  
alert('fail');  
}  
}  
}  
  
(2)使用上面创建的xmlHttp实现最简单的ajax post请求:  
代码如下:
  
function doPost(url,data){  
// 注意在传参数值的时候最好使用encodeURI处理一下,以防出现乱码  
createxmlHttpRequest();  
xmlHttp.open("POST",url);  
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");  
xmlHttp.send(data);  
xmlHttp.onreadystatechange = function() {  
if ((xmlHttp.readyState == 4) && (xmlHttp.status == 200)) {  
alert('success');  
} else {  
alert('fail');  
}  
}  
}  
  

★★★小编:汇盛国际注册 整理文章,欢迎大家转载 ★★★
上一篇:JavaScript 继承详解(五)
下一篇:没有了
相关文章阅读
点击右上角的分享按钮即可收藏汇盛国际平台注册 随时随地与好友一起分享精彩内容噢
最近更新
热门排行