Html 代码：

<html>

<body>

<div id="myDiv"><h3>Let AJAX change this text</h3></div>

<button type="button" onclick="loadXMLDoc()">Change Content</button>

</body>

</html>

js代码：

<script type="text/javascript">

    var xmlhttp;

    function loadXMLDoc() {

        //ajax script goes here...

        if(window.XMLHttpRequest) {

            //code for IE7+, firefox, Chrome, Opera,Sarari

            xmlhttp =  new XMLHttpRequest();

        }else {

            //code for IE6,IE5

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

        }

        if(xmlhttp != null) {

            //创建响应XMLHttpRequest对象状态变化的函数

            xmlhttp.onreadystatechange = httpStateChange;

            //创建http请求

            xmlhttp.open('GET', 'json/data.json', true);

            //发送http请求

            xmlhttp.send(null);

        }

    }

    function httpStateChange() {

        console.log(xmlhttp.readyState, xmlhttp.status);

        //请求中.

        if(xmlhttp.readyState == 1) {

            //loading..

            document.getElementById('myDiv').innerHTML = 'loading..';

        }

        ////异步调用完毕

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

            var data = JSON.parse(xmlhttp.responseText);

            console.log(data);

           document.getElementById('myDiv').innerHTML = data.sites[1].Name;

        }

    }

</script>

ajax 简单例子的更多相关文章

  1. springmvc ajax 简单例子

    1.控制器曾 @Controller public class AjaxController { @RequestMapping("/ajax") public void ajax ...

  2. jsonp的简单例子

    jsonp的简单例子 index.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8&q ...

  3. PHP Ajax简单实例

    最近学习Jquery Ajax部分,通过简单例子,比较了下post,get方法的不同 HTML部分 <html> <head> <title>jQuery Ajax ...

  4. C# .net Jquery ajax 简单示例

    jquery中ajax相信大家都不陌生,这里只写个简单例子示意用法,详细后续再写. 在html中按钮事件中添加如下js var param = "data=" + escape($ ...

  5. ajax简单后台交互

    ajax简单后台交互 1,扯淡 单身的生活,大部分时间享受自由,小部分时间忍受寂寞. 生活有时候,其实蛮苦涩,让人难以下咽.那些用岁月积累起来的苦闷,无处宣泄,在自己的脑海里蔓延成一片片荆棘,让你每每 ...

  6. QQ互联简单例子,七彩花都提供

    QQ互联简单例子 源码由七彩花都论坛提供 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &qu ...

  7. Hibernate4.2.4入门(一)——环境搭建和简单例子

    一.前言 发下牢骚,这段时间要做项目,又要学框架,搞得都没时间写笔记,但是觉得这知识学过还是要记录下.进入主题了 1.1.Hibernate简介 什么是Hibernate?Hibernate有什么用? ...

  8. AgileEAS.NET SOA 中间件平台.Net Socket通信框架-简单例子-实现简单的服务端客户端消息应答

    一.AgileEAS.NET SOA中间件Socket/Tcp框架介绍 在文章AgileEAS.NET SOA 中间件平台Socket/Tcp通信框架介绍一文之中我们对AgileEAS.NET SOA ...

  9. spring mvc(注解)上传文件的简单例子

    spring mvc(注解)上传文件的简单例子,这有几个需要注意的地方1.form的enctype=”multipart/form-data” 这个是上传文件必须的2.applicationConte ...

随机推荐

  1. Python爬虫练习

    例一:爬取信息关于'gbk' codec can't encode character '\xa0' in position 6: illegal 错误提示: #初始化class 得到对象 draw= ...

  2. Linux性能优化实战学习笔记：第四十六讲

    一.上节回顾 不知不觉,我们已经学完了整个专栏的四大基础模块,即 CPU.内存.文件系统和磁盘 I/O.以及网络的性能分析和优化.相信你已经掌握了这些基础模块的基本分析.定位思路,并熟悉了相关的优化方 ...

  3. [LeetCode] 922. Sort Array By Parity II 按奇偶排序数组之二

    Given an array A of non-negative integers, half of the integers in A are odd, and half of the intege ...

  4. 【08月01日】A股滚动市净率PB历史新低排名

    2010年01月01日 到 2019年08月01日 之间,滚动市净率历史新低排名. 上市三年以上的公司,2019年08月01日市净率在30以下的公司. 来源:A股滚动市净率(PB)历史新低排名. 1 ...

  5. Docker学习2-Docker的基本命令与使用

    前言: 前些天有人问镜像是什么?容器有是什么?docker对于初学者来说,往往分不清楚镜像和容器,编程语言都知道有一个面向对象,类和实例,类比作镜像,实例比作容器. 有的人蹦着学习的心态的去群里问人, ...

  6. LeetCode 28：实现strStr() Implement strStr()

    爱写bug(ID:icodebugs) 作者:爱写bug 实现 strStr() 函数. 给定一个 haystack 字符串和一个 needle 字符串,在 haystack 字符串中找出 needl ...

  7. 代码实现一个蛇形led走马灯

    什么叫走马灯? 走马灯又叫流水灯,灯不断的走动,像流水一样,动态显示. makecode图形化编程见:http://bbs.kittenbot.cn/forum.php?mod=viewthread& ...

  8. Java内部类是如何实现的

    内部类(inner class)是定义在另一个类中的类. 内部类方法可以访问该类定义所在的作用域中的数据,包括私有的数据. 内部类可以对同一个包中的其他类隐藏起来 当想定义一个回调函数且不想编写大量代 ...

  9. scala基础题--函数可以没有返回值案例，编写一个函数，从终端输入一个整数，打印出对应的金字塔

    函数可以没有返回值案例,编写一个函数,从终端输入一个整数,打印出对应的金字塔 import scala.io.StdIn object work02 { def main(args: Array[St ...

  10. 【mysql】windows7 安装mysql5.7 解压缩版 + windows7 安装mysql5.7报错 计算机丢失了MSVCR120.dll解决方法

    1.下载mysql 5.7的zip版解压缩的安装包 在mysql官网:http://dev.mysql.com/downloads/mysql/ 2.解压到本地任意目录,并创建一个mysql_data ...