本文提供使用JavaScript实现网页背景图片随机切换的完整代码示例。通过定义图片数组,利用Math.random()生成随机索引,并动态修改document.body.style.backgroundImage属性,实现页面加载时自动切换背景。代码包含初始化设置与定时器逻辑,适用于前端开发中的简单视觉交互需求。
JavaScript随机背景图片切换实现
具体实现代码如下:
<script>
var imgs =["http://images.cnblogs.com/cnblogs_com/xiaobo-Linux/1112236/o_2.jpg",
"http://images.cnblogs.com/cnblogs_com/xiaobo-Linux/1112236/o_default.png",
"http://images.cnblogs.com/cnblogs_com/xiaobo-Linux/1112236/o_3.jpg",
"http://images.cnblogs.com/cnblogs_com/xiaobo-Linux/1112236/o_1.jpg",
"http://images.cnblogs.com/cnblogs_com/xiaobo-Linux/1112236/o_4.jpg",
"http://images.cnblogs.com/cnblogs_com/xiaobo-Linux/1112236/o_5.jpg",
"http://images.cnblogs.com/cnblogs_com/xiaobo-Linux/1112236/o_6.jpg",
"http://images.cnblogs.com/cnblogs_com/xiaobo-Linux/1112236/o_default-2.jpg",
];
var index=Math.floor(Math.random()*8);
var img = imgs[index];
function time(){
document.body.style.backgroundImage="url("+img+")";
}
document.body.onload = function(){
time();
}
</script>
上述内容即为JavaScript实现背景图片随机切换的完整示例,供开发者参考使用。