<!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>修改内容</title>

     <!--

     所有现代浏览器均支持XMLHttpRequest对象（IE6 IE5使用ActiveXObject）

     XMLHttpRequest用于在后台与服务器交换数据，这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新

     创建XMLHttpRequest对象

     IE7+  FireFox   chrome   Opera Safari

      xmlhttp = new XMLHttpRequest();

      IE5 IE6

      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

     -->

     <script>

         function loadXMLDoc() {

             var xmlhttp;

             if (window.XMLHttpRequest) {

                 //code for IE7+  FireFox   chrome   Opera Safari

                 xmlhttp = new XMLHttpRequest();

             } else {

                 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

             }

             /**

              * 当使用async=true时，请规定在想赢处于onreadystatechange事件中的就绪状态时执行的函数

              * 如果async=false时就不必使用onreadystatechange函数，将代码放到send()语句之后即可

              * xmlhttp.open("GET","ajax_info.txt",false);

              *xmlhttp.send();

              *document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

              * */

             xmlhttp.onreadystatechange = function () {

                 if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {

                     document.getElementById("myDiv").innerHTML = xmlhttp.responseText;

                 }

             }

             //open(method,url,async):

             //method :规定请求的类型 GET或POST

             //url : 文件在服务器上的位置

             //async:true为异步  false为同步

             xmlhttp.open("GET", "../ajax_info.txt", true);

             //send(string)将请求发送到服务器  带有string参数的仅用于POST请求

             /**

              * 与POST想比GET更简单也更快，并且在大部分情况下都能使用

              * 然而在以下情况下请使用POST请求：

              * 无法使用缓存文件（更新服务器上的文件或数据库）

              * 向服务器发送大量数据（POST没有数据量限制）

              * 发送包含未知字符的用户输入时POST比GET更稳定也更可靠

              * 使用POST请求时如果需要HTML表单那样POST数据，请使用setRequestHeader()来添加HTTP头然后在send()方法中规定希望发送的数据

              * xmlhttp.open("POST","ajax_test.html",true);

              *xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");

              *xmlhttp.send("fname=Henry&lname=Ford");

              * sendRequestHeader(header,value) header:规定头的名称   value：规定头的值

              *

              * */

             xmlhttp.send();

         }

     </script>

 </head>

 <body>

 <div id="myDiv">

     <h2>使用Ajax修改该文本的内容</h2>

 </div>

 <button type="button" onclick="loadXMLDoc()">修改内容</button>

 </body>

 </html>

[AJAX系列]XMLHttpRequest请求的更多相关文章

  1. Egret和Http请求 (Ajax、XMLHttpRequest、Post、Get)

    一  Http请求 二  AJax和XMLHttpRequest 三  一个Ajax例子 四 Egret中的egret.HttpRequest 五 Post和Get区别 一 Http请求 Http深入 ...

  2. ajax 请求二进制流 图片 文件 XMLHttpRequest 请求并处理二进制流数据 之最佳实践

    写在前面 :从提出需求到完美的解决问题,实现过程是曲折的. 需求:在前(web client)后(Restful Service)端完全解耦的模式框架下,webclient需要请求 Service 返 ...

  3. ajax系列之用jQuery的ajax方法向服务器发出get和post请求

    打算写个ajax系列的博文,主要是写给自己看,学习下ajax的相关知识和用法,以更好的在工作中使用ajax. 假设有个网站A,它有一个简单的输入用户名的页面,界面上有两个输入框,第一个输入框包含在一个 ...

  4. AJAX（XMLHttpRequest）进行跨域请求方法详解（三）

    注意:以下代码请在Firefox 3.5.Chrome 3.0.Safari 4之后的版本中进行测试.IE8的实现方法与其他浏览不同. 3,带验证信息的请求 身份验证是Web开发中经常遇到的问题,在跨 ...

  5. AJAX（XMLHttpRequest）进行跨域请求方法详解（二）

    注意:以下代码请在Firefox 3.5.Chrome 3.0.Safari 4之后的版本中进行测试.IE8的实现方法与其他浏览不同. 2,预检请求 预检请求首先需要向另外一个域名的资源发送一个 HT ...

  6. AJAX（XMLHttpRequest）进行跨域请求方法详解（一）

    注意:以下代码请在Firefox 3.5.Chrome 3.0.Safari 4之后的版本中进行测试.IE8的实现方法与其他浏览不同. 跨域请求,顾名思义,就是一个站点中的资源去访问另外一个不同域名站 ...

  7. AJAX（XMLHttpRequest）进行跨域请求方法详解

    AJAX(XMLHttpRequest)进行跨域请求方法详解(三) 2010年01月11日 08:48:00 阅读数:24213 注意:以下代码请在Firefox 3.5.Chrome 3.0.Saf ...

  8. js进阶ajax的XMLHttpRequest对象的status和statustext属性（如果ajax和php联合使用的话：open连接服务器的第二个参数文件路径改成请求php的url即可）

    js进阶ajax的XMLHttpRequest对象的status和statustext属性(如果ajax和php联合使用的话:open连接服务器的第二个参数文件路径改成请求php的url即可) 一.总 ...

  9. js系列教程11-json、ajax（XMLHttpRequest）、comet、SSE、WebSocket全解

    js系列教程11-json.ajax(XMLHttpRequest).comet.SSE.WebSocket全解:https://blog.csdn.net/luanpeng825485697/art ...

随机推荐

  1. android 滑动滚动条调节音量

    利用滚动条滑动控制音量: 定义: private SeekBar mseekBarvolume: 以下实现代码: //调节音量--begin------------------------- //音量 ...

  2. union all 与order by的连用

    昨天工作过程中发现一个奇怪的地方: 代码段A: 1---select   *  from  table1 2---order  by  no 3---union  all 4---select   * ...

  3. Linux下ejabberd开机自启（CentOS）

    废话少说,Linux下开机自启动Ejabberd步骤如下: 1.从ejabberd安装目录的bin目录拷贝ejabberd.init到/etc/init.d/ejabberd下 [root@imser ...

  4. 支付宝APP支付开发- IOException : DerInputStream.getLength(): lengthTag=127, too big.

    支付宝APP支付Java开发报错: IOException : DerInputStream.getLength(): lengthTag=127, too big. 后来排查是因为没有设置私钥.

  5. Windows Azure虚拟机和云服务实例计费方式更新

    在之前的Windows Azure计费账单中,A0,A1,A2,A3,A4系列的虚拟机(云服务实例)都是以A1为基准计费单位的,即: 虚拟机大小 计费单位(小时) A0 A1*0.25 A1 A1*1 ...

  6. 有时候就是看不进论文-jQuery动画特效篇&MySQL

    hi 早上知道新的乱斗模式后,没忍住开了几把,然后就无心论文了...用这个来破吧 1.jQuery -----动画特效----- ----调用show()和hide()方法显示和隐藏元素 show() ...

  7. LED应用照明产品常识关键点

    一.基本关注点 1.  寿命LIFE(影响灯具寿命主要因素:热管理.工作温度.工作电压.电源.LED结温) 2.  色彩COLOR(新的LED材料以及改进的生产工艺使得高亮度LED可以生产覆盖整个可见 ...

  8. AC日记——密码翻译 openjudge 1.7 09

    09:密码翻译 总时间限制:  1000ms 内存限制:  65536kB 描述 在情报传递过程中,为了防止情报被截获,往往需要对情报用一定的方式加密,简单的加密算法虽然不足以完全避免情报被破译,但仍 ...

  9. Adobe Air移动开发本人体会

    采用FLASH BUILD4.6开发 1.没有mx:Canvas了,s:BordContainer未经手机优化,也不敢用,只有用s:Group 2.好多控件没有了,如DropDownList,Prog ...

  10. [No00001C]不想背单词患者的福音！-快来定制你的个性词包-不想记、记不牢，这可怎么办？

    肯定有朋友觉得我像是在给百词斩做广告一样,其实我可没拿到他们一分钱哦.不过好东西就是要分享,这才是互联网最有价值的地方. 点击下载百词斩