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. [LeetCode] 565. Array Nesting 数组嵌套

    A zero-indexed array A of length N contains all integers from 0 to N-1. Find and return the longest ...

  2. 官方一步解决各种Windows更新问题

    原文部分: 修复 Windows 更新问题 适用于: Windows 8.1Windows 10Windows 7   此分布指南有什么作用? 此分步指南提供的步骤可修复 Windows 更新的问题, ...

  3. 热情组——项目冲刺 Day7

    项目相关 作业相关 具体描述 班级 班级链接 作业要求 链接地址 团队名称 热情组 作业目标 实现软件制作,以及在福大的传播 Github链接 链接地址 SCRUM部分: 成员昵称 昨日目标 开始时间 ...

  4. C# HTTP系列6 HttpWebResponse.StatusCode 响应代码中文详解

    系列目录     [已更新最新开发文章,点击查看详细] 1xx - 信息提示 这些状态代码表示临时的响应.客户端在收到常规响应之前,应准备接收一个或多个 1xx 响应 · 100 - Continue ...

  5. .NetCore 入门篇：理解

    (良心转载)原文地址:https://ken.io/note/dotnet-core-qucikstart-preface 一..NET Core的诞生 聊 .NET Core,就不得不说他的爸爸 . ...

  6. C#调用WPS将文档转换成pdf进行预览

    引用:https://www.jianshu.com/p/445996126c75 vs启动项目可以生成wps实例 本地iis部署的站点却不行 原因是vs是管理员权限,而iis没有权限 解决方法 启动 ...

  7. Laravel自定义排序

    如果数据库的status字段有0,1,2,3几种状态,如果想让status为1,2的状态排在最前面 那么可以这样: $obj = $obj->orderByRaw(DB::raw('FIELD( ...

  8. [转帖]springboot+k8s+抛弃springcloud.eureka

    springboot+k8s+抛弃springcloud.eureka https://www.cnblogs.com/lori/p/12048743.html springboot开发微服务框架一般 ...

  9. mvc控制器接收ajax传送的数据

    视图层中ajax传数据 $.ajax({ type: "post",//提交方式 data: { complay_arry: complay_arry, site_arry: si ...

  10. 【C#】Winform 令人困擾的畫面閃爍問題解法

    DoubleBuffered = true 如果 Control 沒有這個屬性,可以使用我下列擴充函式進行設定︰ public static void SetDoubleBuffered<T&g ...