先说基础一点的get类型的ajax

  1. function loadXMLDoc()
  2. {
  3. var xmlhttp;
    //首先判断浏览器是否支持xmlhttprequest,因为ie56不是这个对象,是activexobject
  4. if (window.XMLHttpRequest)
  5.   {// code for IE7+, Firefox, Chrome, Opera, Safari
  6.   xmlhttp=new XMLHttpRequest();
  7.   }
  8. else
  9.   {// code for IE6, IE5
  10.   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  11.   }
    //然后是当readystate改变的时候,判断状态是否正常,如果正常说明请求完成了,就进行请求后的操作
  12. xmlhttp.onreadystatechange=function()
  13.   {
  14.   if (xmlhttp.readyState==4 && xmlhttp.status==200)
  15.     {
  16.     document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
  17.     }
  18.   }
    //配置参数
  19. xmlhttp.open("GET","/ajax/demo_get.asp",true);
    //提交请求
  20. xmlhttp.send();

下面是post类型,区别不大

  1. var xmlhttp;
  2. if (window.XMLHttpRequest)
  3.   {// code for IE7+, Firefox, Chrome, Opera, Safari
  4.   xmlhttp=new XMLHttpRequest();
  5.   }
  6. else
  7.   {// code for IE6, IE5
  8.   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  9.   }
  10. xmlhttp.onreadystatechange=function()
  11.   {
  12.   if (xmlhttp.readyState==4 && xmlhttp.status==200)
  13.     {
  14.     document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
  15.     }
  16.   }
  17. xmlhttp.open("POST","http://www.weisuyun.com/xiaochengxu.php",true);//GET改为POST
  18. xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");//这是添加http的头
  19. xmlhttp.send("name=Bill&sex=Gates");//send里面写参数

最后是稍微整合一下的

  1. <html>
  2. <head>
  3. <script type="text/javascript">
  4. var xmlhttp;
  5. function loadXMLDoc(url,cfunc)
  6. {
  7. if (window.XMLHttpRequest)
  8.   {// code for IE7+, Firefox, Chrome, Opera, Safari
  9.   xmlhttp=new XMLHttpRequest();
  10.   }
  11. else
  12.   {// code for IE6, IE5
  13.   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  14.   }
  15. xmlhttp.onreadystatechange=cfunc;
  16. xmlhttp.open("GET",url,true);
  17. xmlhttp.send();
  18. }
  19. function myFunction()
  20. {
  21. loadXMLDoc("/ajax/test1.txt",function()
  22.   {
  23.   if (xmlhttp.readyState==4 && xmlhttp.status==200)
  24.     {
  25.     document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
  26.     }
  27.   });
  28. }
  29. </script>
  30. </head>
  31. <body>
  32.  
  33. <div id="myDiv"><h2>Let AJAX change this text</h2></div>
  34. <button type="button" onclick="myFunction()">通过 AJAX 改变内容</button>
  35.  
  36. </body>
  37. </html>

php javascript的ajax的更多相关文章

  1. 最新JavaScript、Ajax典藏级学习资料下载分类汇总 (2011年12月21日更新)

    其他网站开发相关资料            超强HTML和xhtml,CSS精品学习资料下载汇总                                               最新htm ...

  2. 初识JavaScript，Ajax，jQuery，并比较三者关系

    一.基本认识 1.JavaScript 定义: javaScript的简写形式就是JS,是由Netscape公司开发的一种脚本语言,一种广泛用于客户端Web开发的脚本语言,常用来给HTML网页添加动态 ...

  3. JavaScript实现Ajax小结

    置顶文章:<纯CSS打造银色MacBook Air(完整版)> 上一篇:<TCP的三次握手和四次挥手> 作者主页:myvin 博主QQ:851399101(点击QQ和博主发起临 ...

  4. 掌握 Ajax，第 2 部分: 使用 JavaScript 和 Ajax 发出异步请求

    转http://www.ibm.com/developerworks/cn/xml/wa-ajaxintro2/ 掌握 Ajax,第 2 部分: 使用 JavaScript 和 Ajax 发出异步请求 ...

  5. javascript版Ajax请求

    什么是Ajax请求,Ajax也就是“Asynchronous JavaScript and XML”(异步JavaScript和XML),无刷新数据读取.能减少流量的消耗,也提高了浏览的流畅性,给用户 ...

  6. Javascript与Ajax

    不使用jquery来处理ajax请求该怎么做? 首先要明确html中的某些数据需要从服务端获得,也就是客户端向服务端请求(request)数据,服务端就响应(response)这个请求,把客户端要的数 ...

  7. javascript进阶——Ajax

    统的Web 页面和应用中,用户每点击页面上的某个部分,浏览器就会向服务器发出一个请求,等待服务器做出响应,然后返回一个完整新网页,但在大多数情况下用户不得不忍受页面闪烁和长时间的等待.随着Web技术的 ...

  8. Javascript and AJAX with Yii（在yii 中使用 javascript 和ajax）

    英文原文:http://www.yiiframework.com/wiki/394/javascript-and-ajax-with-yii /*** http://www.yiiframework. ...

  9. javascript实现ajax

    什么是 ajax ajax 即“Asynchronous JavaScript and XML”(异步 JavaScript 和 XML),也就是无刷新数据读取. http 请求 首先需要了解 htt ...

  10. JavaScript和ajax 跨域的案例

    今天突然想看下JavaScript和ajax 跨域问题,然后百度看了一下,写一个demo出来 <!DOCTYPE html> <html xmlns="http://www ...

随机推荐

  1. postgresql 查看单个表大小

    3中方法,不论什么一个都行 方法一 ,查一个表 select pg_size_pretty(pg_relation_size('table_name')); 方法二 ,查出全部表并按大小排序 SELE ...

  2. java根据url获取完整域名

    private String getDomain(String destination){ if(destination==null||destination.trim().equals(" ...

  3. 交叉编译工具链bash: gcc：no such file or directory

    在进行交叉编译工具链安装时,有三种方法: 1.源码编译,手动安装 2.二进制可执行文件直接安装 3.直接解压工具链,手动修改环境变量 为了方便,我们多用方法3进行安装.但是问题来了,你的工具链制作时有 ...

  4. mycat基本概念及读写分离一

    mycat基本概念及读写分离一 目录(?)[+] 安装与启动 mycat目录介绍 mycat三个最重要配置文件 验证读写分离 安装与启动 linux下可以下载Mycat-server-xxxxx.li ...

  5. iOS多语言(国际化)开发(尾随系统 + APP内手动设置)

    一:尾随系统切换语言 1>创建好项目project后, 新建一个多语言文件: 2>加入要设置的语言类型: 3>加入成功 细心的朋友可能会发如今English后面写的是3 Files ...

  6. Windows Server 2016 上配置 APACHE+SSL+PHP+perl

    Windows Server 2016 上配置 APACHE+SSL+PHP+perl 安装环境 谷歌云实例 Windows Server 2016 Apache Apache/2.4.25 (win ...

  7. 1.2 Use Cases中 Log Aggregation官网剖析（博主推荐）

    不多说,直接上干货! 一切来源于官网 http://kafka.apache.org/documentation/ Log Aggregation 日志聚合 Many people use Kafka ...

  8. IDEA配置svn地址方法及出现的问题的解决办法

    1.在IDEA中点击File-Settings里面,如图所示,选择你本地装的svn的exe路径: 2.在如图所示菜单中配置svn地址: 问题1:如果svn路径下没有exe文件,则是装svn的时候没有安 ...

  9. time and datetime

    一.简述 我们在写代码的过程经常遇到时间模块,如果我们以后需要根据时间去筛选信息的话,那用户会更大,所以今天就来讲讲时间的两大模块:time & datetime 二.time模块 1.tim ...

  10. 【Codeforces Round #447 (Div. 2) B】Ralph And His Magic Field

    | [链接] 我是链接,点我呀:) [题意] 给你一个n*m矩阵,让你在里面填数字. 使得每一行的数字的乘积都为k; 且每一列的数字的乘积都为k; k只能为1或-1 [题解] 显然每个位置只能填1或- ...