手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >javascript+xml实现简单图片轮换(只支持IE)
javascript+xml实现简单图片轮换(只支持IE)
摘要:最近无聊,看着许多网站都有广告自动轮换,自己试着写了一个图片轮换,代码和功能都很简单,只支持IE的,FF的还要加些东东.xml文件:test...

最近无聊,看着许多网站都有广告自动轮换,自己试着写了一个图片轮换,代码和功能都很简单,只支持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"/>

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>

【javascript+xml实现简单图片轮换(只支持IE)】相关文章:

javascript实现设置、获取和删除Cookie的方法

奇妙的Javascript图片放大镜

javascript实现控制的多级下拉菜单

javascript实现链接单选效果

javascript瀑布流式图片懒加载实例

基于javascript简单实现对身份证校验

javascript实现行拖动的方法

javascript实现dom动态创建省市纵向列表菜单的方法

javascript实现带下拉子菜单的导航菜单效果

javascript结合Flexbox简单实现滑动拼图游戏

精品推荐
分类导航