javascript如何讓圖片自動變換

方法：1、建立圖片路徑數組；2、用timeInterval定義切換時間，setInterval()設定時間定時執行函數；3、取得img對象，設初始curIndex，if語句比較圖片名稱，實現不斷改變圖片名稱進而改變圖片路徑，實現切換效果。

本教學操作環境：windows7系統、javascript1.8.5版、Dell G3電腦。

JavaScript讓圖片自動變換的方法

#1、新建一個html文件，命名為test.html，用來講解怎麼用javascript實現圖片定時切換。

2、在test.html，使用img標籤建立圖片的顯示，並且設定其id屬性為obj，方便下方取得該元素物件。

3、在test.html頁面的script標籤內，使用new Array（）建立一個圖片路徑的陣列，裡面放三張圖片的檔案名稱。

4、在test.html頁面的script標籤內，使用變數timeInterval定義圖片切換的時間為1秒，透過setInterval（）定時器方法設定每秒鐘執行一次changeImg（）函數。

5、在changeImg（）函數內，使用document.getElementById（）方法獲得img對象，設定一個初始curIndex變量，透過if語句比較圖片的名稱，實現不斷改變圖片的名稱。

註：圖片的名稱必須為0，1，2等有序的數字。

6、在changeImg（）函數內，將上一步獲得的圖片名稱用來改變img的圖片路徑，最終實現圖片的定時切換。

更多程式相關知識，請造訪：程式設計影片！ ！

以上是javascript如何讓圖片自動變換的詳細內容。更多資訊請關注PHP中文網其他相關文章！