<!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. Spark standlone安装与配置

    spark的安装简单,去官网下载与集群hadoop版本相一致的文件即可. 解压后,主要需要修改spark-evn.sh文件. 以spark standlone为例,配置dn1,nn2为master,使 ...

  2. web报表移动端如何进行移动设备绑定与撤销

    场景需求描述 为了增强移动端的登录机制验证,保证数据的安全性,报表工具FineReport提供了移动设备绑定的功能,每个系统用户在使用移动端连接系统的时,需要管理员授权,将用户的移动设备与系统绑定起来 ...

  3. 网络错误定位案例 ICMP host *** unreachable - admin prohibited

    1. 环境 一台物理服务器 9.115.251.86,上面创建两个虚机,每个虚机两个网卡: vm1:eth0 - 9.*.*.232 eth1:10.0.0.14 vm2: eth0 - 9.8.*. ...

  4. Python+excel实现的简单接口自动化 V0.1

    好久没写博客了..最近忙着工作以及新工作的事.. 看了下以前写的简单接口自动化,拿出来总结下,也算记录下学习成果 先来贴一下最后的结果,结果是写在原来的excel中 执行完毕后,会将结果写入到“状态” ...

  5. WinCE下GPRS自动拨号软件(GPRS AutoDial)

    之前在WinCE下调试USB的3G Modem时,写过一个拨号助手RASManager,基本能用.后来车机卖到俄罗斯去,客户老M提供了一个更好的GPRS自动拨号软件GPRS AutoDial,功能完善 ...

  6. C#小游戏（文字对战游戏）

    第一代,不是很完善,会在后续增加更多的功能 主: using System; using System.Collections.Generic; using System.Linq; using Sy ...

  7. [No00005C]我也入住Markdown

    概览 宗旨 Markdown 的目标是实现「易读易写」. 可读性,无论如何,都是最重要的.一份使用 Markdown 格式撰写的文件应该可以直接以纯文本发布,并且看起来不会像是由许多标签或是格式指令所 ...

  8. 修复垂直滑动RecyclerView嵌套水平滑动RecyclerView水平滑动不灵敏问题

    在 Android 应用中,大部分情况下都会使用一个垂直滚动的 View 来显示内容(比如 ListView.RecyclerView 等).但是有时候你还希望垂直滚动的View 里面的内容可以水平滚 ...

  9. HTML DOM Document 对象

    HTML DOM Document 对象 HTML DOM 节点 在 HTML DOM (Document Object Model) 中 , 每一个元素都是 节点: 文档是一个文档. 所有的HTML ...

  10. JavaScript Array 对象

    JavaScript Array 对象 Array 对象 Array 对象用于在变量中存储多个值: var cars = ["Saab", "Volvo", & ...