<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

<script type="text/javascript">

function a(){

    /* ----------------------------------------------- */

    var xmlhttp;

if (window.XMLHttpRequest)

{

    //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码

    xmlhttp=new XMLHttpRequest();

}

else

{

    // IE6, IE5 浏览器执行代码

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

}

    /* ----------------------------------------------- */

/* 

*   1、创建引擎对象

*   2、复写 jonreadystatement函数

*

*   3、发送请求

*   4、获取元素对象

*

*/

xmlhttp.onreadystatechange=function(){//声明式调用

    //获取响应

    var result=xmlhttp.responseText;

    var showdiv=document.getElementById("showdiv");

    showdiv.innerHTML=result

}

xmlhttp.open("get","http://localhost:8080/test1")

xmlhttp.send(null)

}

</script>

<style type="text/css">

    #showdiv{

        border:solid 1px;

        width:200px;

        height:100px

         }

</style>

</head>

<body>

   <h3>欢迎登陆403峡谷</h3>

   <input type="button" value="测试" onclick="a()">

    <div id="showdiv"></div>

</body>

</html>
是
<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

<script type="text/javascript">

function a(){

    /* ----------------------------------------------- */

    var xmlhttp;

if (window.XMLHttpRequest)

{

    //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码

    xmlhttp=new XMLHttpRequest();

}

else

{

    // IE6, IE5 浏览器执行代码

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

}

    /* ----------------------------------------------- */

/* 

*   1、创建引擎对象

*   2、复写 jonreadystatement函数

*

*   3、发送请求

*   4、获取元素对象

*

*/

xmlhttp.onreadystatechange=function(){//声明式调用

    //获取响应

    var result=xmlhttp.responseText

    if(xhlthhp.readState==4){

          if(xmlhttp.status==200){

            var showdiv=document.getElementById("showdiv");

            showdiv.innerHTML=result

          }

          if(xmlhttp.status==404){

                      var showdiv=document.getElementById("showdiv");

                      showdiv.innerHTML="页面不存在"

          }

          if(xmlhttp.status==500){

                      var showdiv=document.getElementById("showdiv");

                      showdiv.innerHTML="服务器繁忙"

          }

       } 

}

xmlhttp.open("get","http://localhost:8080/test1")

xmlhttp.send(null)

}

</script>

<style type="text/css">

    #showdiv{

        border:solid 1px;

        width:200px;

        height:100px

         }

</style>

</head>

<body>

   <h3>欢迎登陆403峡谷</h3>

   <input type="button" value="测试" onclick="a()">

    <div id="showdiv"></div>

</body>

</html>

Ajax的基本使用流程的更多相关文章

  1. AJAX是什么? AJAX的交互模型(流程)?同步和异步的区别? AJAX跨域的解决办法?

      AJAX是什么? AJAX的交互模型(流程)?同步和异步的区别? AJAX跨域的解决办法? 分类: web前端面试题2013-07-20 22:40 630人阅读 评论(0) 收藏 举报 目录(? ...

  2. .net学习之Session、Cookie、手写Ajax代码以及请求流程

    1.IIS 7 以上版本集成了两种模式,一种是经典模式,一种是集成模式(直接将asp.net框架集成到IIS中) 2.浏览器和服务器端通过什么技术来实现的?Socket(套接字),通信的语法是HTTP ...

  3. js.ajax优缺点，工作流程

    1.ajax的优点 Ajax的给我们带来的好处大家基本上都深有体会,在这里我只简单的讲几点: 1.最大的一点是页面无刷新,在页面内与服务器通信,给用户的体验非常好.  2.使用异步方式与服务器通信,不 ...

  4. jQuery-1.9.1源码分析系列（十六）ajax——ajax处理流程以及核心函数

    先来看一看jQuery的ajax核心处理流程($.ajax) a. ajax( [url,] options )执行流程 第一步,为传递的参数做适配.url可以包含在options中 //传递的参数只 ...

  5. ajax基础学习

    AJAX即"Asynchronous JavaScript and XML",意思是异步JavaScript和XML,是指一种创建交互式网页的网页开发技术. 虽然现在很少有人去自己 ...

  6. 快速理解-Ajax

    AJAX即“Asynchronous JavaScript and XML”,意思是异步JavaScript和XML,是指一种创建交互式网页的网页开发技术. 虽然现在很少有人去自己手动写AJAX,大多 ...

  7. 触碰jQuery：AJAX异步详解

    触碰jQuery:AJAX异步详解 传送门:异步编程系列目录…… 示例源码:触碰jQuery:AJAX异步详解.rar AJAX 全称 Asynchronous JavaScript and XML( ...

  8. jQuery调用AJAX异步详解[转]

    AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1)   使用CSS和X ...

  9. Ajax学习(1)-简单ajax案例

    1.什么是Ajax? Ajax是Asynchronous JavaScript and XML 的缩写,即异步的Javascript和XML. 可以使用Ajax在不加载整个网页的情况下更新部分网页信息 ...

随机推荐

  1. C# 坦克大战笔记（1）

    1.游戏对象父类:GameObject 成员: 游戏对象的X,Y坐标,高度,宽度,方向,对象,以及生命值. 绘制游戏对象的抽象方法Draw(); 绘制对象移动的方法Move() 返回矩形的方法,用于碰 ...

  2. 让img图片像背景一样显示

    如何让图片像背景一样显示呢? 这里需要用到object-fit属性 MDN地址:https://developer.mozilla.org/zh-CN/docs/Web/CSS/object-fit ...

  3. word 插入表格，位置不在最左边

    首先想到的是 样式的问题.

  4. 如何查询数据库中所有表格，或者查询是否存在某个表格-mysql和oracle

    这个问题,在之前就有写过,但是想找到语句还是记不得,这里主要提及我自己有用到的数据库mysql和oracle 1.mysql 这个是自己安装的,所有配置都是默认配置没有改变,所以保存表名的表还是inf ...

  5. ZR#1012

    ## ZR#1012 blog咕咕咕了好久,开始补. 解法: 一个很显然的性质, $ x $ 只能转移到 $ x+1 $ 或者 $ 2x $ 处,所以我们可以以此性质建图,即 $ x $ 向 $ x ...

  6. [MYSQL手工注入](2)基于布尔的SQL盲注实战

    0x02 MYSQL 手工注入实战--基于布尔的SQL盲注 前言,之前有对MYSQL基于报错的手工注入进行过介绍,但今天的实验环境,并不是基于报错的SQL注入,而是一个基于布尔的SQL盲注测试流程. ...

  7. FLUENT不同求解器离散格式选择【转载】

    转载自:http://blog.163.com/wu_yangfeng/blog/static/16189737920104158950438/ 离散格式对求解器性能的影响 控制方程的扩散项一般采用中 ...

  8. rapidxml学习

    参考: 官网http://rapidxml.sourceforge.net/ https://blog.csdn.net/wqvbjhc/article/details/7662931 http:// ...

  9. 安卓开发实战之app之版本更新升级(DownloadManager和http下载)完整实现

    转载: https://blog.csdn.net/u013278099/article/details/52692008 前言 本文将讲解app的升级与更新.一般而言用户使用App的时候升级提醒有两 ...

  10. Spring源码之DefaultListableBeanFactory及资源载入

    1.XmlBeanFactory 的使用,参考MyEclipse Spring 学习总结一 Spring IOC容器 public static void main(String[] args) { ...