进入旧版 | 服务项目 | 成功案例 | 联系方式 | 过客留言 | 友情链接
   
设为首页
加入收藏
联系我们
网站首页 | 新闻资讯 | 操作系统 | 办公软件 | 网络软件 | 工具软件 | 媒体动画 | 网页制作 | 网站开发 | 程序开发 | 平面设计
Photoshop视频教程 | Word入门 | Flash入门 | JScript | VBScript | ASP | PHP | ADO | 网页特效 | 3DS MAX6.0命令 | 系统进程
您当前的位置:GOODSGY电脑学习网 -> 网站开发 -> JavaScript -> 文章内容  
用AJAX编写一个简单的相册

AJAX(Asynchronous JavaScript And XML)是一种运用JavaScript和可扩展标记语言(XML),在网络浏览器和服务器之间传送或接受数据的技术。主要应用于Ria(Rich internet applications)的开发上。

  xml问题终于在今天还是解决了。最后在FireFox里还是使用了Dom的一些老方法。我这里就具体解释一下方法吧.

  代码:

var XmlHttp; //用来定义一个xmlHttpRequest对象
var temp_url_arr=new Array()
var temp_title_arr=new Array()
var list_arr=new Array()
if (window.XMLHttpRequest) {
 XmlHttp = new XMLHttpRequest()
 if (XmlHttp.overrideMimeType) {
  XmlHttp.overrideMimeType('text/xml');
 }
} else if (window.ActiveXObject) {
 XmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
//上面这段话是判断当前浏览器版本,以定义给XmlHttp不同的xmlHttpRequest对象.如果服务器的响应没有XML mime-type header,某些Mozilla浏览器可能无法正常工作。 所以需要XmlHttp.overrideMimeType('text/xml');来修改该header.

function getData() { //读取数据
 XmlHttp.onreadystatechange = praseXml;
 XmlHttp.open("GET", "xmldata2.xml", true);
 XmlHttp.send(null);
}

function praseXml() { //解析数据
 if (XmlHttp.readyState == 4) {
  if (XmlHttp.status == 200) {
   var xmldoc = XmlHttp.responseXML;
   var root=xmldoc.getElementsByTagName('data').item(0)
   //使用这样的方法才可在FireFox里面生效.至少xPath我没成功过.
   for (var iRoot = 0; iRoot < root.childNodes.length; iRoot++) {
    //alert(root.childNodes.item(iRoot))
    var pic_node=root.childNodes.item(iRoot)
    for (iPic = 0; iPic < pic_node.childNodes.length; iPic++) {
     var url_node=pic_node.childNodes.item(iPic)
     for (iURL = 0; iURL < url_node.childNodes.length; iURL++) {
      var obj=new Object()
      obj.type=url_node.nodeName
      obj.content=url_node.childNodes.item(iURL).nodeValue
      if(url_node.nodeName == "url"){
       temp_url_arr.push(obj)
      }else if(url_node.nodeName == "title"){
       temp_title_arr.push(obj)
      }
     }
    }
   }
   install_list()
  }
 }
}

function install_list(){ //整理得到的数据并装载到list_arr数组中。
 list_arr=new Array()
 var target_div=document.getElementById('catelog');
 target_div.innerHTML=""
 for(var i=0;i<temp_url_arr.length;i++){
  var obj=new Object()
  obj.url=temp_url_arr[i].content
  obj.title=temp_title_arr[i].content
  list_arr.push(obj)
 }
 for(var i=0;i<list_arr.length;i++){
  target_div.innerHTML +="<a href='#'  onClick='img_loader(\""+list_arr[i].url+"\");'>"+list_arr[i].title+"</a><br>";
 }
}

function img_loader(param1){ //加载图片方法
 var target_div=document.getElementById('pic');
 target_div.innerHTML="<img src="+param1+">"
}

在百度中搜索:用AJAX编写一个简单的相册
在Google中搜索:用AJAX编写一个简单的相册
在Yahoo中搜索:用AJAX编写一个简单的相册

收藏到网摘:新浪VIVI 365key 我摘 POCO网摘 博采中心 YouNote 和讯网摘 天天收藏
[] [返回上一页] [打 印] [收 藏]

 相关文章    最新文章
· 用AutoCAD画粗实线的两种方法
· [图文] 使用ASP.NET AJAX框架扩展HTML Map..
· [图文] 用AutoCAD将三维弯管模型转成二维图..
· [组图] 用Adobe ImageReady定制适合自己的..
· [组图] 用Adobe Photoshop织出一条牛仔裤
· 利用Ajax传递Xml文档
· 用ASP+CSS实现随机背景
· [组图] 使用Actions面板(1)
· [组图] 使用Actions面板(2)
· [图文] 用Actionscript 2.0创建平面坐标系..
 
· 用JS解决网站防挂iframe木马的方案
· 技巧 JavaScript常用判断函数
· IE浏览器中一个值得关注的JS问题
· 简易实现DIV圆角的JavaScript代码
· Javascript调用XML制作连动下拉框
· Javascript实现页内查找关键词实例
· JavaScript的系统函数学习
· JavaScript仿Windows关机效果
· javascript弹出窗口问题总结
· 在JS中使用RecordSet对象的GetRows方法

∷相关文章评论∷    (评论内容只代表网友观点,与本站立场无关!) [更多评论…]
站内搜索

精彩图文
  网站导航  
操作系统 办公软件 网络软件
Vista Windows2003 WindowsXP Windows2000/NT Windows9X/ME Linux 其他 Word Excel Powerpoint Outlook 金山系列 其他 网页浏览 上传下载 联络聊天 邮件工具 服务器软件 网络辅助
工具软件 媒体动画 网页制作
系统工具 媒体工具 压缩工具 图文处理 文件管理 其他 3DMAX Authorware Director Maya 视频处理 其他 Flash Dreamweaver FireWorks FrontPage LiveMotion Golive HTML/CSS 其它
网站开发 平面设计 程序设计
ASP JSP PHP CGI JavaScript VBScript XML/SOAP Web服务器 Photoshop PhotoImpact CorelDraw Illustrator Freehand 设计欣赏 其他 VB VC .NET C/C++ DELPHI JAVA

冀ICP备05019428号
Copyright © 2004-2008 电脑学习网 Inc.All rights reserved.
TEL:13832340607
QQ:39873155
E_Mail:goodsgy(#)hotmail.com   (把(#)替换成@)
MSN:goodsgy(#)hotmail.com   (把(#)替换成@)