xhr 原生兼容写法

  1. // create xhr object cross browser
  2. function createXHR() {
  3. if(typeof XMLHttpRequest != ‘undefined‘){
  4. return new XMLHttpRequest();
  5. }
  6. else if(typeof ActiveXObject != ‘undefined‘){
  7. if(typeof arguments.callee.activeXString != ‘string‘){
  8. var versions = [‘MSXML2.XMLHttp.6.0‘,‘MSXML2.XMLHttp.3.0‘ ,‘MSXML2.XMLHttp‘], // ie browser different vesions
  9. i,len;
  10. for(i=0,len=versions.length; i<len;i++){
  11. try{
  12. new ActiveXObject(versions[i]);
  13. arguments.callee.activeXString = versions[i];
  14. break;
  15. }
  16. catch(ex){
  17. // jump
  18. }
  19. }
  20. }
  21. return new ActiveXObject(arguments.callee.activeXString);
  22. }
  23. else{
  24. throw new Error(‘No XHR object available.‘);
  25. }
  26. }
  27. function xhrRequest(url,callback){
  28. var xhr = createXHR();
  29. xhr.onreadystatechange = function(){
  30. if(xhr.readyState == 4){
  31. if((xhr.status >= 200 && xhr.status<300) || xhr.status == 304){  //200 表示相应成功 304 表示缓存中存在请求的资源
  32. // 对响应的信息写在回调函数里面
  33. var str = xhr.status+‘ ‘+xhr.responseText;
  34. callback(str);
  35. }
  36. else{
  37. return ‘request is unsucessful ‘+xhr.status;
  38. }
  39. }
  40. }
  41. xhr.open(‘get‘,url,true);
  42. xhr.send();
  43. }
  44. function hundler(data){
  45. console.log(data);
  46. }
  47. window.onload = function(){
  48. xhrRequest(‘resource.txt‘,hundler);
  49. }
时间： 2024-08-26 12:18:25

xhr 原生兼容写法的相关文章

常用原生JS兼容写法

在我们前端开发中,经常会遇到兼容性的问题,因为要考虑用户会使用不同的浏览器来访问你的页面,你要保证你做的网页在任何一个浏览器中都能正常的运行,下面我就举几个常用原生JS的兼容写法: 1:添加事件方法 addHandler:function(element,type,handler){  if(element.addEventListener){//检测是否为DOM2级方法   element.addEventListener(type, handler, false);  }else if (e

原生JS forEach()和map()遍历的区别以及兼容写法

一.原生JS forEach()和map()遍历 共同点: 1.都是循环遍历数组中的每一项. 2.forEach() 和 map() 里面每一次执行匿名函数都支持3个参数:数组中的当前项item,当前项的索引index,原始数组input. 3.匿名函数中的this都是指Window. 4.只能遍历数组. 1.forEach() 没有返回值. arr[].forEach(function(value,index,array){ //do something }) 参数:value数组中的当前项,

map() 和 forEach() 区别 兼容写法

兼容写法: 不管是forEach还是map在IE6-8下都不兼容(不兼容的情况下在Array.prototype上没有这两个方法),那么需要我们自己封装一个都兼容的方法,代码如下: /** * forEach遍历数组 * @param callback [function] 回调函数: * @param context [object] 上下文: */ Array.prototype.myForEach = function myForEach(callback,context){ contex

javascript获取行间样式和非行间样式--兼容写法

style:获取行间样式: currentStyle:获取计算后的样式,也叫当前样式.最终样式. 优点:可以获取元素的最终样式,包括浏览器的默认值,而不像style只能获取行间样式,所以更常用到.注意:不能获取复合样式如background属性值,只能获取单一样式如background-color等. alert (oAbc.currentStyle);IE8和Opera 11弹出了“object CSSStyleDeclaration”:FF 12.chrome 14.safari 5则弹出“

JavaScript中的数组遍历forEach()与map()方法以及兼容写法

原理: 高级浏览器支持forEach方法 语法:forEach和map都支持2个参数:一个是回调函数(item,index,list)和上下文: forEach:用来遍历数组中的每一项:这个方法执行是没有返回值的,对原来数组也没有影响: 数组中有几项,那么传递进去的匿名回调函数就需要执行几次: 每一次执行匿名函数的时候,还给其传递了三个参数值:数组中的当前项item,当前项的索引index,原始数组input: 理论上这个方法是没有返回值的,仅仅是遍历数组中的每一项,不对原来数组进行修改:但是我

CSS3之flex兼容写法

很久不写博文,之前的长时间不上都关闭了,但随着工作时间长越来越长,对知识的积累和总结还真的是很重要的.所以奉劝码农们每天都还是要抽出来一点时间总结点东西,以后对你受益匪浅!!今天还是变谈CSS3里的flex怎么处理兼容的 flex是个非常好用的属性,如果说有什么可以完全代替 float 和 position ,那么肯定是非它莫属了,虽然现在低版本浏览器不支持,可是对于移动来说兼容性不是问题,可是在安卓4.3以后版本里.那就不好用了,今天咱们就说下如果写flex才能保证兼容性. flex之所以有兼

background-size： contain 与cover的区别，以及ie78的兼容写法

一:background-size: contain 与cover的区别: 作用: 都是将图片以**相同宽高比**缩放以适应整个容器的宽高. 不同之处在于: 1.  在no-repeat情况下,如果容器宽高比与图片宽高比不同, cover:图片宽高比不变.铺满整个容器的宽高,而图片多出的部分则会被截掉: contain:图片自身的宽高比不变,缩放至图片自身能完全显示出来,所以容器会有留白区域: PS:其实,从英文的意思来说:cover意味着“遮罩.遮盖”---此处理解为“塞满”较恰当,conta

currentStyle和getComputedStyle的兼容写法

今天学习javascript的时候,教程中介绍了一种简单实现jQuery 中css()方法的写法 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> #div{ width: 200px; height: 200px; background: re

opacity兼容写法

1 .opacity{ 2 position: absolute; 3 top: 0px;left: 0px; 4 background: #000; 5 filter:alpha(opacity=50); /* IE */ 6 -moz-opacity:0.5; /* 老版Mozilla */ 7 -khtml-opacity:0.5; /* 老版Safari */ 8 opacity: 0.5; /* 支持opacity的浏览器*/ 9 } Js写法 1 object.filter = "a