javascript+xml实现简单图片轮换(只支持IE)

213 阅读 0 评论 141 点赞

我是靠谱客的博主淡然牛排，最近开发中收集的这篇文章主要介绍javascript+xml实现简单图片轮换(只支持IE)，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

最近无聊,看着许多网站都有广告自动轮换,自己试着写了一个图片轮换,代码和功能都很简单,只支持IE的,FF的还要加些东东.

xml文件:test.xml

复制代码代码如下:

 
<?xml version="1.0" encoding="gb2312"?> 
<ad> 
<neteasy path="image/64_jpg.jpg">http://www.163.com</neteasy> 
<sina path="image/lining.jpg">http://www.sina.com.cn</sina> 
<sohu path="image/Image00045.jpg">http://www.sohu.com</sohu> 
</ad> 

HTML

复制代码代码如下:

 
<img id="image1" name="image1" src="image/64_jpg.jpg" style="cursor:hand; width: 110px; height: 103px;"/> 

javascript

复制代码代码如下:

 
<script> 
//图片轮换 
var a = 0 ; 
var xmlDoc; 
var image1 = document.getElementById("image1"); 
function loadxml(path) 
{ 
xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); 
xmlDoc.async = false; 
xmlDoc.load(path); 
} 
loadxml("test.xml"); 
function changeImage() 
{ 
var ad = xmlDoc.getElementsByTagName("ad")[0]; 
if(a == ad.childNodes.length) 
{ 
a=0; 
} 
var path = ad.childNodes[a].getAttribute("path"); 
var url = ad.childNodes[a].text; 
image1.src = path; 
image1.onclick = function(){window.open(url);}; 
a+=1; 
setTimeout("changeImage()",1000); 
} 
changeImage(); 
</script> 