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 相关文章推荐
使用PHP+JQuery+Ajax分页的实现
Apr 23 Javascript
jquery如何扑捉回车键触发的事件
Apr 24 Javascript
jQuery实现浮动层随浏览器滚动条滚动的方法
Sep 22 Javascript
js检查是否关闭浏览器的方法
Aug 02 Javascript
浅谈angularjs依赖服务注入写法的注意点
Apr 24 Javascript
利用Vue.js+Node.js+MongoDB实现一个博客系统(附源码)
Apr 24 Javascript
JavaScript定时器setTimeout()和setInterval()详解
Aug 18 Javascript
详谈commonjs模块与es6模块的区别
Oct 18 Javascript
vue props传值失败 输出undefined的解决方法
Sep 11 Javascript
微信小程序实现音频文件播放进度的实例代码
Mar 02 Javascript
Element Popover 弹出框的使用示例
Jul 26 Javascript
SpringBoot+Vue开发之Login校验规则、实现登录和重置事件
Oct 19 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
实现WordPress主题侧边栏切换功能的PHP脚本详解
2015/12/14 PHP
PHP实现微信提现功能
2018/09/30 PHP
PHP常见的几种攻击方式实例小结
2019/04/29 PHP
Package.js  现代化的JavaScript项目make工具
2012/05/23 Javascript
jQuery之ajax删除详解
2014/02/27 Javascript
JQuery中extend使用介绍
2014/03/13 Javascript
js实现网站最上边可关闭的浮动广告条代码
2015/09/04 Javascript
基于javascript实现动态时钟效果
2020/08/18 Javascript
Node.js检测端口(port)是否被占用的简单示例
2016/09/29 Javascript
assert()函数用法总结(推荐)
2017/01/25 Javascript
JS作用域链详解
2017/06/26 Javascript
vue之浏览器存储方法封装实例
2018/03/15 Javascript
JavaScript私有变量实例详解
2019/01/24 Javascript
详解JavaScript中的函数、对象
2019/04/01 Javascript
vue组件间的参数传递实例详解
2019/04/26 Javascript
uni app仿微信顶部导航条功能
2019/09/17 Javascript
p5.js绘制创意自画像
2019/11/04 Javascript
python网络编程学习笔记(八):XML生成与解析(DOM、ElementTree)
2014/06/09 Python
Python常用模块用法分析
2014/09/08 Python
手动实现把python项目发布为exe可执行程序过程分享
2014/10/23 Python
Python中使用Tkinter模块创建GUI程序实例
2015/01/14 Python
简单介绍Python中的round()方法
2015/05/15 Python
python实现爬虫统计学校BBS男女比例之数据处理(三)
2015/12/31 Python
python实现点对点聊天程序
2018/07/28 Python
python实现飞机大战游戏
2020/10/26 Python
Django  ORM 练习题及答案
2019/07/19 Python
Python PyPDF2模块安装使用解析
2020/01/19 Python
numba提升python运行速度的实例方法
2021/01/25 Python
新学期家长寄语
2014/01/19 职场文书
关于读书的演讲稿500字
2014/08/27 职场文书
2014年学校法制宣传日活动总结
2014/11/01 职场文书
文化苦旅读书笔记
2015/06/29 职场文书
大卫科波菲尔读书笔记
2015/06/30 职场文书
结婚幸福感言
2015/08/01 职场文书
2016年小学生寒假家长评语
2015/10/10 职场文书
sqlserver连接错误之SQL评估期已过的问题解决
2022/03/23 SQL Server