<%@ page contentType="text/html; charset=gb2312"%> ajax的小例子
网站公告:   ◆北天JAVA技术网热情为java爱好者服务,本网内容包括JAVA(JSP、servlet、EJB、webservice、j2ee、javabean、应用服务器、JavaScript),数据库(MYSQL、SQL Server、Sybase、Oracle、DB2、数据库综合知识),设计研究(设计模式、Struts、Spring、Hibernate、设计框架、设计综合知识),WEB2.0新技术(主要介绍AJAX),以及各种技术的入门、实例、例子等等,欢迎各位多来坐坐!◆  诚邀各位JAVA爱好者加盟!◆  本网站内容丰富,更新快,保证每周20篇以上!  
加入收藏
设为首页
联系站长
承接项目
  相关资源:网站首页 | 免费培训学院 | 技术论坛 | JAVA聊天室 | 作家专栏 | 开发工具 | 认证考试 | 会员俱乐部
  JAVA技术初学者园地 | jsp与servlet | javascript | Java源代码 | EJB | web service | 应用服务器 | JAVA综合知识
  设计研究设计模式 | 设计框架 | Struts | Spring | Hibernate | 开源项目 | 面向对象设计 | 设计综合知识
  数 据 库MYSQL | SQL Server | Sybase | Oracle | DB2 | Informix | Access | 数据库综合知识
  其他资源:AJAX新技术 | 网站开发 | ERP软件 | OA办公软件 | 商业智能BI | 开发综合知识 | 承接项目 | 项目试用

 
 
ajax的小例子
     发布者:wangzhongjie 发布时间:2007-01-11
好长时间没写东西。。。

ajax.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script type="text/javascript" src="xmlhttprequest.js"></script>
</HEAD>

<BODY>
<div id="see">

</div>
<input type="button" onclick="sendRequest()" value="SendRequest">
<script>

 var xmlhttp = new XMLHttpRequest(); 
 var xmldoc;
 function sendRequest(){  
  document.all("see").innerHTML = "Loading....";  
  var url = "http://localhost:8080/tree.xml";
  xmlhttp.open("GET",url,true);
  xmlhttp.onreadystatechange = viewPage;  
  xmlhttp.send(null);
 }
 function viewPage(){  
  
  if (xmlhttp.readyState == 4 && xmlhttp.status==200) {
   alert("haha get xml ")
   xmldoc = xmlhttp.responseXML; 
   var xmlobj = xmldoc.documentElement;
   var str = "";
   for(var i = 0; i< xmlobj.childNodes.length;i++){
    var node = xmlobj.childNodes;
    var text = node.getAttribute("nodeid");
    var value =  text;
    str += "<span style='display:block'  onclick='getsub(""+value+"")'>"+text+"</span><br><div style='display:none' id="+text+"></div>";
   }
   document.all.see.innerHTML = str;
   //alert(xmlobj.tagName)
  }
 }
 function getsub(id){
  if(xmldoc!=null){
   var root = xmldoc.getElementsByTagName("TreeNode");
   var str2 = "";
   for(var k = 0;k<root.length;k++){    
    if(root[k].getAttribute("nodeid")==id){
     document.all(id).style.display = '';
     document.all(id).innerHTML = "loading..."
     alert("get sub tree")
     var nodes = root[k].childNodes;
     for(var m = 0;m<nodes.length;m++){
      var node = nodes[m];
      var text = node.getAttribute("nodeid");      
      str2 += "<span  onclick='getsub(""+text+"")'>&nbsp;&nbsp;"+text+"</span><br><div style='display:none' id="+text+"></div>";
     }     
     document.all(id).innerHTML = str2 ;//alert(document.all(id).innerHTML)
    }
     
   }
  }else{
   alert("Exception!!");
  }
 }
 
</script>
</BODY>
</HTML>

最好将tree。xml放到tomcat下,不知为什么直接访问xml返回的xml对象为空

tree.xml

<?xml version="1.0" encoding="ISO-8859-1"?>
<Tree>
<TreeNode nodeid="wangzhongjie">
 <TreeNode nodeid="wang"></TreeNode>
 <TreeNode nodeid="zhong"></TreeNode>
 <TreeNode nodeid="jie"></TreeNode>
</TreeNode>
<TreeNode nodeid="yinhang">
 <TreeNode nodeid="yin"></TreeNode>
 <TreeNode nodeid="hang"></TreeNode> 
</TreeNode>
</Tree>

(转载文章请保留出处:北天JAVA技术网(www.java114.com))
 
更多精彩文章:
一个简单例子教你揭开AJAX神秘面纱
ajax 完美例子
Ajax简单例子
什么是Ajax
技术分析DWR让AJAX如此简单
在 AJAX 开发中集成数据库技术
 
        
标 题:   
内 容:   
 
                                  
 
免责声明:该文章由网友发表,如果对您造成侵权,请联系站长

首页 - 承接项目 - 网站地图 - 联系我们 -
版权所有北天JAVA技术工作室 ICP证号:粤ICP备06079815号