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 相关文章推荐
JavaScript去除空格的几种方法
Oct 03 Javascript
父节点获取子节点的字符串示例代码
Feb 26 Javascript
10个很棒的jQuery代码片段
Sep 24 Javascript
基于jquery编写分页插件
Mar 07 Javascript
JavaScript接口的实现三种方式(推荐)
Jun 14 Javascript
KnockoutJS 3.X API 第四章之数据控制流with绑定
Oct 10 Javascript
解决百度Echarts图表坐标轴越界的方法
Oct 17 Javascript
详解Vue之父子组件传值
Apr 01 Javascript
Vue 权限控制的两种方法(路由验证)
Aug 16 Javascript
vue+moment实现倒计时效果
Aug 26 Javascript
微信小程序实现modal弹出框遮罩层组件(可带文本框)
Dec 20 Javascript
如何用JavaScript实现一个数组惰性求值库
May 05 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内核之php in array
2015/11/10 PHP
thinkphp3.x中display方法及show方法的用法实例
2016/05/19 PHP
PHP微信开发之文本自动回复
2016/06/23 PHP
laravel 框架配置404等异常页面
2019/01/07 PHP
求解开jscript.encode代码的asp函数
2007/02/28 Javascript
优秀js开源框架-jQuery使用手册(1)
2007/03/10 Javascript
jquery 上下滚动广告
2009/06/17 Javascript
什么是JavaScript
2009/08/13 Javascript
js编码、解码函数介绍及其使用示例
2013/09/05 Javascript
JS简单实现动画弹出层效果
2015/05/05 Javascript
浅析JS操作DOM的一些常用方法
2016/05/13 Javascript
jQuery中ajax错误调试分析
2016/12/01 Javascript
完美解决node.js中使用https请求报CERT_UNTRUSTED的问题
2017/01/08 Javascript
Angular.js组件之input mask对input输入进行格式化详解
2017/07/10 Javascript
Vue.js中的图片引用路径的方式
2017/07/28 Javascript
Vue通过阿里云oss的url连接直接下载文件并修改文件名的方法
2020/12/25 Vue.js
Vue多选列表组件深入详解
2021/03/02 Vue.js
python正则表达式中的括号匹配问题
2014/12/14 Python
详解Django rest_framework实现RESTful API
2018/05/24 Python
python 读取目录下csv文件并绘制曲线v111的方法
2018/07/06 Python
python 2.7.13 安装配置方法图文教程
2018/09/18 Python
十分钟搞定pandas(入门教程)
2019/06/21 Python
Python项目 基于Scapy实现SYN泛洪攻击的方法
2019/07/23 Python
Python使用QQ邮箱发送邮件报错smtplib.SMTPAuthenticationError
2019/12/20 Python
opencv python 图片读取与显示图片窗口未响应问题的解决
2020/04/24 Python
python pyecharts 实现一个文件绘制多张图
2020/05/13 Python
MxNet预训练模型到Pytorch模型的转换方式
2020/05/25 Python
KIEHL’S科颜氏官方旗舰店:源自美国的顶级护肤品牌
2018/06/07 全球购物
C#里面如何判断一个Object是否是某种类型(如Boolean)?
2016/02/10 面试题
业务代表的岗位职责
2013/11/16 职场文书
普通党员四风问题对照检查材料
2014/09/27 职场文书
房屋租赁合同补充协议
2014/10/11 职场文书
2016年中学端午节主题活动总结
2016/04/01 职场文书
导游词之河北滦平金山岭长城
2019/10/16 职场文书
详解TS数字分隔符和更严格的类属性检查
2021/05/06 Javascript
CSS中实现动画效果-附案例
2022/02/28 HTML / CSS