AJAX在网站服务中使用到频率很高，也需要考虑各个浏览器版本的兼容性，本示例中详细介绍简单快捷的处理兼容性问题。

  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  5. <title>AJAX</title>
  6. <style>
  7. .myBtn{
  8. 	background:#3498db;
  9. 	color:#fff;
  10. 	font-size:14px;
  11. 	text-align:center;
  12. 	width:100px;
  13. 	height:36px;
  14. 	line-height:34px;
  15. 	border:none 0;
  16. 	cursor:pointer;
  17. }
  18. </style>
  19. <script>
  20. window.onload = function() {
  22. 	var oBtn = document.getElementById('btn');
  24. 	oBtn.onclick = function() {
  26. 		/*
  27. 			1.创建一个ajax对象
  28. 				ie6以下new ActiveXObject('Microsoft.XMLHTTP')
  29. 		*/
  30. 		var xhr = null;
  32. 		//第一种处理兼容方式
  33. 		/*if (window.XMLHttpRequest) {
  34. 			xhr = new XMLHttpRequest();  //Firefox(或其他非IE)
  35. 		} else {
  36. 			xhr = new ActiveXObject('Microsoft.XMLHTTP');  //IE浏览器
  37. 		}*/
  39. 		//第二种处理兼容方式
  40. 		try {
  41. 			xhr = new XMLHttpRequest();
  42. 		} catch (e) {
  43. 			xhr = new ActiveXObject('Microsoft.XMLHTTP');
  44. 		}
  46. 		/*
  47. 			open方法
  48. 			参数
  49. 				1.打开方式
  50. 				2.地址
  51. 				3.是否异步
  52. 					异步:非阻塞 前面的代码不会影响后面代码的执行
  53. 					同步:阻塞 前面的代码会影响后面代码的执行
  54. 		*/
  55. 		xhr.open('get','links/1.txt',true);
  57. 		//提交 发送请求
  58. 		xhr.send();
  60. 		//等待服务器返回内容
  61. 		xhr.onreadystatechange = function() {
  63. 			if ( xhr.readyState == 4 ) {
  64. 				alert( xhr.responseText );
  65. 			}
  67. 		}
  69. 	}
  70. }
  71. </script>
  72. </head>
  74. <body>
  75. 	<input type="button" value="按钮" id="btn" class="myBtn" />
  76. </body>
  77. </html>

通过创建对象，使用try catch语句：try…catch 可以测试代码中的错误。try 部分包含需要运行的代码，而 catch 部分包含错误发生时运行的代码。通过open方法来发送请求的地址等待返回结果。

AJAX的兼容处理方式的更多相关文章

  1. Ajax的兼容及Ajax的缓存问题

    Ajax的兼容: 在ie 6 7 8 不支持XMLHttpRequest的对象: 他的Ajax内置对象为ActiveXObject("Microsoft XMLHTTP") 除了内 ...

  2. Struts2实现ajax的两种方式

    基于Struts2框架下实现Ajax有两种方式,第一种是原声的方式,另外一种是struts2自带的一个插件. js部分调用方式是一样的: JS代码: function testAjax() { var ...

  3. JQuery书写Ajax的几种方式?

    1 $.ajax({ type: "Post", //请求方式 ("POST" 或 "GET"), 默认为 "GET" ...

  4. 通过XMLHttpRequest和jQuery实现ajax的几种方式

    AJAX大家已经都知道了,是为了实现异步通讯,提高用户体验度,而将很多旧知识(XML,DOM,JavaScript,HTML,Jquery,Css……)重新融合的一个新的知识框架.而,XMLHttpR ...

  5. jquery的ajax和原始的ajax这两种方式的使用方法

    jquery的ajax是对原始的ajax进行的封装,方便用户的使用.下面用代码分别举例各自的使用方式. jquery的ajax发送和接收xml数据格式. $.ajax({ type: "PU ...

  6. (转载)MVC + JQUERY + AJAX的几种方式

    MVC + JQUERY + AJAX的几种方式 // 传过去一个简单值,获取一个简单值 $.ajax({            type: "GET",         url: ...

  7. AJAX中的请求方式以及同步异步的区别

    AJAX中的请求方式以及同步异步的区别请求方式,分为GET与POST: GET 最为常见的HTTP请求,普通上网浏览页面就是GET.GET方式的参数请求直接跟在URL后,以问号开始.(JS中用wind ...

  8. ajax的post提交方式和传统的post提交方式哪个更快？

    如果同时用ajax和post提交先执行哪个呢?是ajax返回后再执行post呢还是同时执行? ajax的post提交方式和传统的post提交方式哪个更快? >> php这个答案描述的挺清楚 ...

  9. ajax两张传输数据方式

    encodeURI() 函数可把字符串作为 URI 进行编码. 语法 encodeURI(URIstring) 参数 描述 URIstring 必需.一个字符串,含有 URI 或其他要编码的文本. 返 ...

随机推荐

  1. python 中的 int() 与 round

    int(x):向下取整 round(x):超过 .5 则向上取整,否则向下取整

  2. Java 9 New Features

    Java 9 概述 1. jdk 9 的发布.经过 4 次跳票,历经曲折的 java 9 终于终于在 2017 年 9 月 21 日发布. 2. Java 9 中哪些不得不说的新特性?java 9 提 ...

  3. dfs & bfs总结

    dfs 最简单的三种形式递归总结 bfs 百度https://baike.baidu.com/item/%E5%AE%BD%E5%BA%A6%E4%BC%98%E5%85%88%E6%90%9C%E7 ...

  4. base64相关

    1.base64指定的64个字符(包含52个大小写.10个数字和+./): abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789 ...

  5. Jquery练习1

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  6. php cli 下 php.ini 配置

    // 查看phpcli 模式下 扩展 php -m // 查看php cli 版本 php -v 查看命令行的ini路径,命令行下运行 php --ini Loaded Configuration F ...

  7. Python实现一个LRU

    class Node: key = None value = None pre = None next = None def __init__(self, key, value): self.key ...

  8. 《iOS开发实战 从入门到上架App Store（第2版）》书籍目录

    第1章 开发准备 1.1 iOS 10新特性简述 1.1.1 新增触觉反馈编程接口 1.1.2 SiriKit框架的开放 1.1.3 引入Messages App 1.1.4 通知框架的整合与扩展 1 ...

  9. Page Cache(页缓存)

    Page Cache 由内存中的物理page组成,其内容对应磁盘上的block. page cache的大小是动态变化的. backing store: cache缓存的存储设备 一个page通常包含 ...

  10. 关于ubuntu挂载ntfs无法进行读写的解决方法

    查看挂载信息 df -h 参看要挂载磁盘UUID sudo blkid 编辑/etc/fstab文件: sudo vim /etc/fstab 在最后一行添加如下一行信息: UUID=A248CF46 ...