JavaScript實(shí)現(xiàn)背景自動(dòng)切換小案例

更新時(shí)間：2019年09月27日 14:06:57 作者：小羽向前跑

這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)背景自動(dòng)切換小案例，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

本文實(shí)例為大家分享了js實(shí)現(xiàn)背景自動(dòng)切換的具體代碼，供大家參考，具體內(nèi)容如下

功能：

窗口打開(kāi)背景圖自動(dòng)跳轉(zhuǎn)切換

所有代碼：

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>背景切換</title>
</head>
<body>
<img src="img/1.jpg" width="500" id="imgId"/>
</body>
</html>
<script type="text/javascript">
 window.onload = function () {

 setInterval(step, 1000);
 }
 var num = 1;
 function step() {
 if (num < 5) {
  num++;
 } else {
  num = 1;
 }
 var dom = document.getElementById("imgId");
 //更改它images的src屬性
 dom.src = 'img/' + num + '.jpg';
 }

</script>

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

微信外喚起微信小程序的方法詳解
這篇文章主要介紹了微信外喚起微信小程序的方法,結(jié)合實(shí)例形式詳細(xì)分析了微信外喚起微信小程序的相關(guān)步驟、原理與操作注意事項(xiàng),需要的朋友可以參考下
2023-07-07
7個(gè)你應(yīng)該知道的JS原生錯(cuò)誤類型
這篇文章主要介紹了7個(gè)你應(yīng)該知道的JS原生錯(cuò)誤類型，對(duì)此感興趣的同學(xué)，可以參考一下
2021-04-04
JS co 函數(shù)庫(kù)的含義和用法實(shí)例總結(jié)
這篇文章主要介紹了JS co 函數(shù)庫(kù)的含義和用法,結(jié)合實(shí)例形式總結(jié)分析了JS co 函數(shù)庫(kù)的基本含義、功能、用法及操作注意事項(xiàng),需要的朋友可以參考下
2020-04-04
一篇文章搞定JavaScript類型轉(zhuǎn)換(面試常見(jiàn))
這篇文章主要介紹了一篇文章搞定JavaScript類型轉(zhuǎn)換(面試常見(jiàn))，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下吧
2017-01-01
JS將光標(biāo)聚焦在文本最后的實(shí)現(xiàn)代碼
這篇文章主要介紹了JS將光標(biāo)聚焦在文本最后的方法,需要的朋友可以參考下
2014-03-03
javascript屬性訪問(wèn)表達(dá)式用法分析
這篇文章主要介紹了javascript屬性訪問(wèn)表達(dá)式用法,實(shí)例分析了javascript屬性訪問(wèn)表達(dá)式的功能與使用方法,需要的朋友可以參考下
2015-04-04
js事件流、事件委托與事件階段實(shí)例詳解
事件委托應(yīng)用在很多開(kāi)發(fā)場(chǎng)景之中,但是很多同學(xué)對(duì)委托的原理、特別是對(duì)JS原生實(shí)現(xiàn)委托不太了解,下面這篇文章主要給大家介紹了關(guān)于js事件流、事件委托與事件階段的相關(guān)資料,需要的朋友可以參考下
2022-02-02
javascript 中設(shè)置window.location.href跳轉(zhuǎn)無(wú)效問(wèn)題解決辦法
這篇文章主要介紹了javascript 中設(shè)置window.location.href跳轉(zhuǎn)無(wú)效問(wèn)題解決辦法的相關(guān)資料,需要的朋友可以參考下
2017-02-02
Javascript前端UI框架Kit使用指南之kitjs的對(duì)話框組件
本文以kitjs對(duì)話框組件為例，給我們?cè)敿?xì)介紹了kitjs的組件目錄、默認(rèn)代碼模板、構(gòu)造器及初始方法、以及Kitjs繼承。講解的非常細(xì)致，對(duì)我們熟練掌握kitjs組件很有幫助。
2014-11-11
JS前端知識(shí)點(diǎn)offset，scroll，client，冒泡，事件對(duì)象的應(yīng)用整理總結(jié)
這篇文章主要介紹了JS前端知識(shí)點(diǎn)offset，scroll，client，冒泡，事件對(duì)象的應(yīng)用,結(jié)合實(shí)例形式總結(jié)分析了offset，scroll，client，冒泡，事件對(duì)象相關(guān)功能、原理及操作注意事項(xiàng),需要的朋友可以參考下
2019-06-06