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


Posted in Javascript onDecember 23, 2012

最近无聊,看着许多网站都有广告自动轮换,自己试着写了一个图片轮换,代码和功能都很简单,只支持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>
Javascript 相关文章推荐
document.getElementById方法在Firefox与IE中的区别
May 18 Javascript
javascript 触发HTML元素绑定的函数
Sep 11 Javascript
浅谈EasyUi ComBotree树修改 父节点选择的问题
Nov 07 Javascript
AngularJS的ng Http Request与response格式转换方法
Nov 07 Javascript
微信小程序 省市区选择器实例详解(附源码下载)
Jan 05 Javascript
在vue2.0中引用element-ui组件库的方法
Jun 21 Javascript
element-ui使用导航栏跳转路由的用法详解
Aug 22 Javascript
浅谈在vue中使用mint-ui swipe遇到的问题
Sep 27 Javascript
angular5 子组件监听父组件传入值的变化方法
Sep 30 Javascript
Js代码中的span拼接问题解决
Nov 22 Javascript
详细分析Node.js 多进程
Jun 22 Javascript
Vue文本模糊匹配功能如何实现
Jul 30 Javascript
JavaScript与DOM组合动态创建表格实例
Dec 23 #Javascript
JavaScript执行效率与性能提升方案
Dec 21 #Javascript
JS实现图片预加载无需等待
Dec 21 #Javascript
Javascript根据指定下标或对象删除数组元素
Dec 21 #Javascript
JavaScript实现统计文本框Textarea字数增强用户体验
Dec 21 #Javascript
js返回上一页并刷新代码整理
Dec 21 #Javascript
左右悬浮可分组的网站QQ在线客服代码(可谓经典)
Dec 21 #Javascript
You might like
php中防止伪造跨站请求的小招式
2011/09/02 PHP
PHP面向对象学习笔记之二 生成对象的设计模式
2012/10/06 PHP
php版微信自动获取收货地址api用法示例
2016/09/22 PHP
详解php实现页面静态化原理
2017/06/21 PHP
PHP生成加减算法方式的验证码实例
2018/03/12 PHP
HTML中不支持静态Expando的元素的问题
2007/03/08 Javascript
JS与框架页的操作代码
2010/01/17 Javascript
Javascript判断图片尺寸大小实例分析
2014/06/16 Javascript
jQuery实现简单滚动动画效果
2016/04/07 Javascript
Vuejs第十二篇之动态组件全面解析
2016/09/09 Javascript
vue时间格式化实例代码
2017/06/13 Javascript
浅谈angular2路由预加载策略
2017/10/04 Javascript
angular2中Http请求原理与用法详解
2018/01/11 Javascript
深入理解vue中slot与slot-scope的具体使用
2018/01/26 Javascript
微信小程序实现导航栏选项卡效果
2020/06/19 Javascript
vue.js中proxyTable 转发请求的实现方法
2018/09/20 Javascript
Python与Redis的连接教程
2015/04/22 Python
python修改操作系统时间的方法
2015/05/18 Python
python3 模拟登录v2ex实例讲解
2017/07/13 Python
python+pyqt5编写md5生成器
2019/03/18 Python
关于Python作用域自学总结
2019/06/10 Python
Pytorch卷积层手动初始化权值的实例
2019/08/17 Python
python中matplotlib条件背景颜色的实现
2019/09/02 Python
Django REST Framework之频率限制的使用
2019/09/29 Python
Python提取视频中图片的示例(按帧、按秒)
2020/10/22 Python
python 数据类型强制转换的总结
2021/01/25 Python
html5唤起app的方法
2017/11/30 HTML / CSS
可能这些是你想要的H5软键盘兼容方案(小结)
2019/04/23 HTML / CSS
Guess美国官网:美国知名服装品牌
2019/04/08 全球购物
拉夫劳伦爱尔兰官方网站:Ralph Lauren爱尔兰
2020/04/10 全球购物
艺术设计专业个人求职信
2014/04/10 职场文书
销售求职信范文
2014/05/26 职场文书
课堂打架检讨书200字
2014/11/21 职场文书
美容院管理规章制度
2015/08/05 职场文书
学习习近平主席讲话心得体会
2016/01/20 职场文书
深入浅出的讲解:信号调制到底是如何实现的
2022/02/18 无线电