一简单的Ajax例子[通俗易懂]

一简单的Ajax例子[通俗易懂]—ajax.html http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>http://www.w3.org/1999/xhtml”lang=”en”dir=”ltr”>DevelopingWebApplicationwithAjax-Example//此函数将在电击”ViewXMLdata”链接

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

—ajax.html

 

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd“>
<html xmlns=”http://www.w3.org/1999/xhtml” lang=”en” dir=”ltr”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″/>
<title>Developing Web Application with Ajax – Example</title>

<script type=”text/javascript”>
<!–
//此函数将在电击”View XML data”链接的时候执行
function ajaxRead(file){

 //xmlObj,负责客户端和服务器中转
 var xmlObj=null;
 
 /*
   测试不同对象的可用性
  
   不同的浏览器执行XMLHttpRequest对象的时候不同,所以定义”xmlObj”作为XMLHttpRequest对象的时候,必须区别对待
   如果没有XMLHttpRequest可用,函数以return结束来取消错误报告
 */
 if(window.XMLHttpRequest){

  xmlObj=new XMLHttpRequest();
 }else if(window.ActiveXObject){

  xmlObj=new ActiveXObject(“Microsoft.XMLHTTP”);
 }else{

  return;
 }
 /*
   每当XMLHttpRequest状态改变时,onreadystatechange事件就触发
   此事件共有5个状态,从0到4
  
   [0]uninitialized未初始化(在XMLHttpRequest开始前)
   [1]loading(一旦初始化)
   [2]loaded(一旦XMLHttpRequest从服务器获得响应)
   [3]interactive(当对象连接到服务器)
   [4]complete(完成)
 */
 /*
   readyState()方法用来获得当前XMLHttpRequest的状态
  
   状态5[编号4]是用来确认数据是否可用的,如果”是”,则执行updateObj方法
   此方法有2个参数:ID,填充的数据
 */
 /*
  xmlObj.responseXML属性是一个DOM对象,对于XML文件来说,它有点像网页中的”document”对象
  通过getElementsByTagName可以获得XML文件中的任何节点
  
  xmlObj.responseXML.getElementsByTagName(‘data’)[0]是获得第1个名称为”data”的节点
  它返回XML节点,无数据的—得到节点里的数据必须通过访问此节点的属性
  
  firstChild.data
  (firstChild获得<data>节点之间的文本节点,而”data”属性则是文本节点的实际文本)
 */
 /*
   xmlObj.open(‘GET’,file,true);
   xmlObj.send(”);
   这是ajaxRead函数中的最后一块
  
   xmlObj的open方法打开一个通往服务器的连接(通过一个特殊的协议,这里指定为”GET”—也可以使用”POST”或其他)
   请求一个文件(在这里,file变量—data.xml,是当作参数发送给了ajaxRead函数)
   并且JavaScript可以操控这个请求是否为同步(false)或者异步(true,默认)
  
   这是异步JavaScript和XML,将可以使用默认的异步方法—当使用同步之后,这个程序将不能运行
  
   xmlObj.send(”);
   简单的发送了一个空字符串给服务器
   如果没有这一行,xmlObj的readystate的值将不能为4,使得页面将不能更新
   这个发送方法可以被用于其它东西,但是此程序仅仅从服务器得到数据,并没有发送数据给服务器,所以就到此为止
 */
 xmlObj.onreadystatechange=function(){

  if(xmlObj.readyState==4){

   updateObj(‘xmlObj’,xmlObj.responseXML.getElementsByTagName(‘data’)[0].firstChild.data);
  }
 }
 xmlObj.open(‘GET’,file,true);
 xmlObj.send(”);
}

/*
  此函数更新在当前页有新值的其他任何元素
  第1个参数,”obj”,是当前页中一个元素的id—这是被更新的对象
  第2个参数,”data”,指明了将要替换”obj”对象的一个新的字符串
  正常地,它是一个检查并且确认当前页有含有id值为”obj”的元素的很好的方法
 
*/
function updateObj(obj,data){

  //document.getElementById(obj).firstChild.data = data;
  document.getElementById(obj).innerHTML=data;
}
//–>
</script>
</head>

<body>
 <h1>Developing Web Application with Ajax</h1>
 <p id=”xmlObj”>
  <a href=”data.xml” title=”View the XML data.” οnclick=”ajaxRead(‘data.xml’);this.style.display=’none’;return false”>View XML data.</a>
 </p>
</body>
</html>

 

—data.xml

 

<?xml version=”1.0″ encoding=”utf-8″?>
<root>
    <data>
  This is some sample data… It is stored in an XML file and retrieved by JavaScript.
   </data>
</root>

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/158755.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • webstorm激活码【2021免费激活】[通俗易懂]

    (webstorm激活码)2021最新分享一个能用的的激活码出来,希望能帮到需要激活的朋友。目前这个是能用的,但是用的人多了之后也会失效,会不定时更新的,大家持续关注此网站~IntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,下面是详细链接哦~https://javaforall.net/100143.html…

    2022年3月26日
    516
  • 反射型XSS的利用「建议收藏」

    反射型XSS的利用「建议收藏」反射型XSS:用户输入的恶意代码,被执行。利用:它通过给别人发送带有恶意脚本代码参数的URL,当URL地址被打开时,特有的恶意代码参数被HTML解析、执行。它的特点是非持久化,必须用户点击带有特定参数的链接才能引起。以前一直觉得反射型XSS危害不大,只能自己在客户端玩玩,实现弹窗。没想到,反射型XSS的利用比存储型还更容易,存储型XSS的利用还需结合CSRF.这篇博客很好的讲述了反射型XS…

    2022年5月4日
    97
  • HBase开发: Java API 管理表

    HBase开发: Java API 管理表头歌(JavaAPI管理表)答案我看网上都没有这一关的答案,就自己写了一个。

    2022年7月16日
    14
  • 领域建模与数据库建模[通俗易懂]

    首先两者比较: 我下面是引用的别人的文章,并且感觉有句话很好,不过除了这句话其它的话都不是很好,哈哈:有些人就把问题归结于Java语言本身,睡不着觉怪床歪。 我们知道:一个软件从无到有需要经过如下几个阶段:分析、设计、编程、调试、部署和运行。   编程阶段我们通常使用Java/.NET这样面向对象语言工具,可以带来很多设计上的好处,但是也存在一个奇怪的现象:很多程序员虽然在

    2022年4月16日
    36
  • PyCharm使用教程 — 4、界面/菜单栏介绍

    PyCharm使用教程 — 4、界面/菜单栏介绍界面介绍从大的方向来看PyCharm分为菜单栏区域/项目结构区域/代码区域/运行信息区菜单栏提示:菜单栏快捷键为Alt+首字母,比如File的快捷键Alt+F,Edit的快捷键Alt+E1、File(文件)NewProject:创建新的项目New…:新建一些中间件配置,如MySQL、MongoDB、DDL等以及相关驱动NewScratchFile:划痕文档,也称为临时文件,可以创建各种类型的文件进行临时处理,在里面“打草稿”,

    2022年8月27日
    3
  • volatile关键字经常用在多个线程并发写_多线程安全的单例模式

    volatile关键字经常用在多个线程并发写_多线程安全的单例模式一.事先准备首先准备一个运行用的代码:publicclassSingleton{publicstaticvoidmain(String[]args){Thread[]thre

    2022年8月16日
    9

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号