Ajax 笔记

发布时间：2020-12-15 21:59:20 所属栏目：百科来源：网络整理

导读：Technorati 标签: ajax 一、Ajax 简介 Ajax = 异步的 javascript 和 xml； Ajax是一种用于快速创建动态网页的技术。原理图如下： 650) this.width=650;" style="border-right- 0px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0p

Technorati 标签: ajax

一、Ajax 简介

Ajax = 异步的 javascript 和 xml；

Ajax是一种用于快速创建动态网页的技术。原理图如下：

二、Demo

   1: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

   2: <html xmlns="http://www.w3.org/1999/xhtml">

   3: <head>

   4: <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

   5: <title>ajax</title>

   6: <script type="text/javascript">

7:

8:

   9:     function loadDoc() {

  10:         var xmlhttp;

  11:         if (window.XMLHttpRequest) {// code for IE7+,Firefox,Chrome,Opera,Safari

  12:             xmlhttp = new XMLHttpRequest();

  13:         } else {// code for IE6,IE5

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

  15:         }

  16:         xmlhttp.onreadystatechange = function() {

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

  18:                 document.getElementById("text").innerHTML = xmlhttp.responseText;

  19:             }

  20:         }

  21:         xmlhttp.open("get","/ajaxTest/text.txt",true);

  22:         xmlhttp.send();

  23:     }

24:

  25: </script>

  26: </head>

27:

  28: <body>

  29:     <div id="text">Ajax can change these text<

  30:     <button onclick="loadDoc()" value="change">change</button>

  31: </body>

  32: </html>

33:

  34: //text.txt 内容可以自己随意编写，只需保证其在路径下就行了。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!