学习的动力是最近想实现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. go学习笔记-环境安装

    环境安装 环境安装 主要包含三个部分 运行环境及开发sdk 系统环境和路径配置 IDE配置 以mac环境为例,其他环境类似 运行环境及开发sdk 使用 brew 安装 brew install go ...

  2. R语言数据结构二

    上节我们讲到R语言中的基本数据类型,包括数值型,复数型,字符型,逻辑型以及对应的操作和不同数值类型之间的转换.众所周知,R语言的优势在于进行数据挖掘,大数据处理等方面,因此单个的数据并不能满足我们的需 ...

  3. Keil C51编译报错error C141: syntax error

    错误代码: typedef unsigned char uchar uchar KeyRowColumnScan() { GPIO_KEY = 0x0f; uchar key_value = ; // ...

  4. WPF 访问外部的xaml文件

    原文:WPF 访问外部的xaml文件 今天做主题时,需要访问外部的xaml文件,方法: using (FileStream s = new FileStream("C:\\Control.x ...

  5. 【转载】特殊宏://{{AFX_MSG、//{{AFX_VIRTUAL、//{{AFX_MSG_MAP、//{{AFX_DATA_INIT

    原文:http://yyguangzheng.blog.163.com/blog/static/603488402014102215153610/ 说明:这篇日志我不知道怎么命名好,虽然内容很少,但是 ...

  6. 【转载】COM 组件设计与应用(九)——IDispatch 接口 for VC6.0

    原文: http://vckbase.com/index.php/wv/1224.html 一.前言 终于写到了第九回,我也一直期盼着写这回的内容耶,为啥呢?因为自动化(automation)是非常常 ...

  7. 二维码Data Matrix的解码实现(zxing-cpp)

    二维码Data Matrix的介绍可以参考http://blog.csdn.net/fengbingchun/article/details/44279967 ,以下是通过zxing-cpp开源库实现 ...

  8. CSS快速入门-实用技巧

    1.整体布局 大部分的布局都是由三部分组成,header.body.footer. 代码布局:写三个div <!DOCTYPE html> <html lang="en&q ...

  9. C++模板的实现(模板函数和模板类,附带模板实现顺序表和链表代码)

    文章链接:https://blog.csdn.net/qq_38646470/article/details/80209469

  10. CF刷题-Codeforces Round #481-F. Mentors

    题目链接:https://codeforces.com/contest/978/problem/F 题目大意: n个程序员,k对仇家,每个程序员有一个能力值,当甲程序员的能力值绝对大于乙程序员的能力值 ...