学习的动力是最近想实现servlet向js传值，是html中的js，因为jsp是可以直接调用java 类的，在网上搜索了好久感觉ajax能帮我实现。

以下代码可以实现js向服务器发出一 request服务器响应一个文本或者XML js接受并且向叶面输出，html页面很简单三个标签，俩链接，另外一个负责显示接受的数据,另外患有俩一个是txt文本,一个是XML格式的文件内涵choices标签

html

<!DOCTYPE html>

<html>

  <head>

    <title>readFromServer.html</title>

    

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

    <meta http-equiv="description" content="this is my page">

    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    

    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

<script type="text/javascript" src="readFromServer.js"></script>

  </head>

  

  <body>

<a id="makeTextRequest" href="gAddress.txt">请求文本</a>

<a id="makeXMLRequest" href="us_states.xml">请求XML文件</a>

<div id="updateArea">&nbsp;</div>

  </body>

</html>

js 

alert("start");

window.onload=initAll;

var xhr=false;//全局变量，在后面的真正使用时是接受的数据，这里bool型没什么用

function initAll(){

    document.getElementById("makeTextRequest").onclick=getNewFile;///该函数的返回值为false表示最后点击链接后不跳转页面，当然前提是返回语句以及返回语句之前的代码都是正确的

    document.getElementById("makeXMLRequest").onclick=getNewFile;

}

function getNewFile(){

    alert(this.href);

    makeRequest(this.href);//将所点击的链接的地址获取到

    return false;//不加载新页面 前提是这句语句以前的没有错误 否侧依然跳转

}

function makeRequest(url){

    if(window.XMLHttpRequest){//该对象存在表示当前浏览器是firefox,opera,safiar,IE7.0,IE8.0中的一个都有这个对象

        xhr=new XMLHttpRequest();    }

    else{

       if(window.ActiveXObject){//IE6.0，5.5中存在的是该对象

        

            try{

                xhr=new ActiveXObject("microsoft.XMLHTTP");

                }

            catch(e){}

        }

    }

    alert(xhr);

    if(xhr){//如果获得了xml对象

        alert("getxhr");

        xhr.onreadystatechange=showContents;

        xhr.open("GET", url,true);//请求的方法（get post head） 文件的地址 请求是否异步也就是我们是否会等到请求完成

        xhr.send(null);

    }

    else{

        document.getElementById("updateArea").innerHTML="抱歉，我不能创建XML请求";

    }

}

function showContents(){

    alert(xhr.readyState);

    if(xhr.readyState==){//响应已经完全被接受

        alert(xhr.status);

        if(xhr.status==){//200 表示请求的文件存在 404表示文件不存在

            //alert(xhr.responseXML+".........."+xhr.responseXML.contentType);

            if(xhr.responseXML&&xhr.responseXML.contentType=="application/xml"){

                alert("XML");

                var outMsg=xhr.responseXML.getElementsByTagName("choices")[].textContent;

            }

            else{

                alert("text");

                var outMsg=xhr.responseText;

            }

        }

        else{

            var outMsg="请求出现问题"+xhr.status;

        }

        document.getElementById("updateArea").innerHTML=outMsg;

    }

}

新手学ajax1的更多相关文章

  1. [ZZ]新手学 appium-合集第一季度

    原文地址: https://testerhome.com/topics/2599 新手学appium-合集第一季度地址如下: 1.新手学 appium-GUI 端搞起来:http://testerho ...

  2. 新手学Java，有哪些入门知识点？

    很多小伙伴们在刚接触Java的时候,会有些迷茫,不知道该从哪里入手,不管是做前端还是后端,程序员都会用到JAVA,那该掌握哪些必要的基础知识呢.今天就跟大家分享新手学Java,有哪些入门知识点? 下面 ...

  3. 新手学js的效果图1---（ 淘宝等商城货物查看特效）

    本人结合之前所学一起写了,多个特效,只是新手自己瞎鼓捣的,思路清晰,具体实现的货物放大镜等,替换当中的img地址就可以查看特效 <!DOCTYPE html> <html lang= ...

  4. 新手学逆向，调试abexcm1过程

    写在前面的话:在下完全就是一个新手,现在目前在学16位汇编,偶尔用OD调试看看程序,主要就是为了学习,今天写这个帖子,完全就是笔记用,然后拿出来和大家一起讨论交流. 因为刚开始接触,文章可能一些地方有 ...

  5. 【新手学Python】一、基础篇

    由于以前处理数据用Matlab和C,最近要处理大量文本文件,用C写实在是太繁琐,鉴于Python的强大文本处理能力,以及其在Deep Learning上有着很大优势,本人打算从即日起学习Python, ...

  6. 新手学Android

    Eclipse平台下的新手Android学习记录. 1.打开一个本地的项目 在Project Explorer右键->Import->Existing Projects into Work ...

  7. 新手学vim配置

    我是新手啦,以前都没接触过Vim编辑器,所以感觉不怎么顺手,毕竟还没有用习惯.也没有什么基础,所以在配置的时候就一直在网上查资料....想要把vim编辑器配置成VS的话可以参考这个:http://ww ...

  8. 新手学Unity3d的一些网站及相应学习路线

    一.unity3d有什么优势 如果您对开发游戏感兴趣,而又没有决定选择哪一个游戏引擎,别犹豫了 unity3d是一个很好的选择! 就我来看unity3d优势主要有以下几方面:首先部署简单,自带了一个I ...

  9. 新手学python（1）：解析XML与系统调用

    最近需要做一个项目,完成一批音乐的格式转换.由于之前并未学习过python,所以想借此机会学一下.在介绍自己的学习过程之前,先把项目简要描述一下.目前在一台服务器a上有几十万首原始的MP3音乐文件,现 ...

随机推荐

  1. CentOS7.6离线安装MySql5.7

    准备好mysql的离线安装文件: MySql官网下载mysql-5.7.25-1.el7.x86_64.rpm-bundle,并复制到/usr/mysql文件夹中. 删除CentOS自带的MariaD ...

  2. day 85 Vue学习之vue-cli脚手架下载安装及配置

      1. 先下载node.js,下载地址:https://nodejs.org/en/download/ 找个目录保存,解压下载的文件,然后配置环境变量,将下面的路径配置到环境变量中. 由于 Node ...

  3. 在myeclipse等IDE中添加本地的dtd与schema约束文件

      *针对没有网络无法正确引入dtd而使用不了提示的问题 (配置完后重启IDE)   window->perferences- > 搜索xml c 找到xml catalog 右边点击 a ...

  4. JavaWeb总结（二）

    Web服务器的缺陷 Web服务器是被设计用来向客户端提供HTTP服务的,它只能向客户端提供静态网页内容.静态页面是原封不动的待在Web服务器目录中,服务器找到静态网页,并把它原样传回到客户端.每个客户 ...

  5. [BZOJ3772]精神污染 主席树上树+欧拉序

    3772: 精神污染 Time Limit: 10 Sec  Memory Limit: 64 MB Description 兵库县位于日本列岛的中央位置,北临日本海,南面濑户内海直通太平洋,中央部位 ...

  6. PostgreSQL调整内存与IO的参数说明

    磨砺技术珠矶,践行数据之道,追求卓越价值 回到上一级页面:PostgreSQL内部结构与源代码研究索引页    回到顶级页面:PostgreSQL索引页 [作者:高健@博客园 luckyjackgao ...

  7. 关于manacher

    由一个题引入: 求一个串A的最长回文串: A=abababa最长回文串长度:5(ababa) 先思考用hash怎么做? 一.暴力 枚举左端,右端点(确定一个区间),线性扫一遍当前区间. Ans=max ...

  8. 19-[模块]-json/pickle、shelve

    1.序列化? 序列化是指把内存里的数据类型转变成字符串,以使其能存储到硬盘或通过网络传输到远程,因为硬盘或网络传输时只能接受bytes (1)把字典保存到文件 data = { 'roles': [ ...

  9. 洛咕 P4304 [TJOI2013]攻击装置

    把坐标按照(x+y)%2染色可以发现这是个二分图 二分图最大独立集=点数-最大匹配 于是就是个算匹配的傻逼题了 // luogu-judger-enable-o2 #include<bits/s ...

  10. 2018"百度之星"程序设计大赛 - 资格赛 1002 子串查询

    题面又是万能的毒毒熊... 实在不想写了,就只写了这题 记26个前缀和查询枚举最小值直接算 实在是氵的死 而且我忘记输出Case #%d 想了很久 >_< #include<bits ...