zoukankan      html  css  js  c++  java
  • AJAX 的简单用法:

    AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。

    AJAX 是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

    1. XMLHttpRequest 对象;

        所有现代浏览器(IE7+、Firefox、Chrome、Safari 以及 Opera)均内建 XMLHttpRequest 对象:variable=new XMLHttpRequest();

       老版本的 Internet Explorer (IE5 和 IE6)使用 ActiveX 对象:variable=new ActiveXObject("Microsoft.XMLHTTP");

        为了应对所有的现代浏览器的写法:

        var xmlhttp;
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
          }
        else
           {// code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }




    2.向服务器发送请求:

             一个简单的 GET 请求:

         xmlhttp.open("GET","demo_get.asp",true);
         xmlhttp.send();
    
    
    

            一个简单 POST 请求:

        xmlhttp.open("POST","demo_post.asp",true);
        xmlhttp.send();


    3.服务器响应
    responseText
    属性返回字符串形式的响应:
      document.getElementById("ID").innerHTML=xmlhttp.responseText;
    
    
    4.onreadystatechange 事件:
    属性:
    onreadystatechange:存储函数(或函数名),每当 readyState 属性改变时,就会调用该函数
           readyState:0: 请求未初始化1: 服务器连接已建立2: 请求已接收3: 请求处理中4: 请求已完成,且响应已就绪 
           status: 200: "OK"  404: 未找到页面
           当 readyState 等于 4 且状态为 200 时,表示响应已就绪:
              xmlhttp.onreadystatechange=function()
                 {
                      if (xmlhttp.readyState==4 && xmlhttp.status==200)
                    {
                      document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
                    }
                 }
    
    一个简单的AJAX的例子的完整写法:
     function cha(){
    //创建xmlHttpRequest对象
    var xmlhttp;
    if (window.XMLHttpRequest)
    {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
    }
    else
    {// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }

    //向服务器发送请求,服务器根据状态响应,返回数据
    xmlhttp.onreadystatechange=function()
    {
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    div1.innerHTML=xmlhttp.responseText;
    }
    }
    xmlhttp.open("GET","页面一.html",true);
    xmlhttp.send();

    }

























  • 相关阅读:
    随笔和文章的区别
    02. 什么是 SOA?
    GOF 23种设计模式(Patterns in Java)
    ASP.NET MVC: how to include <span> in link from Html.ActionLink?
    Head First 02.观察者模式(Observer)
    ActionResult types in MVC2
    探索推荐引擎内部的秘密,第 1 部分: 推荐引擎初探
    Head First 01.策略模式(Strategy Pattern)
    SOA实施:不能忽略商业价值
    nmon analyser——生成 AIX 性能报告的免费工具
  • 原文地址:https://www.cnblogs.com/liaolei1/p/5514609.html
Copyright © 2011-2022 走看看