HTML是一門網頁編程語言,可以用它創建各種各樣的網頁元素。其中插入圖片是一個常用的操作,我們可以通過HTML代碼將圖片插入到網頁中。
有時候,我們需要在網頁中展示多張圖片,并讓它們隨機顯示。這個要求可以通過一些簡單的HTML和JavaScript代碼實現。
<!DOCTYPE html> <html> <head> <title>隨機圖片展示</title> </head> <body> <script> // 定義圖片數組 var images = ["image1.jpg", "image2.jpg", "image3.jpg", "image4.jpg"]; // 隨機選取一張圖片 var selectedImage = images[Math.floor(Math.random() * images.length)]; // 創建圖片元素 var img = document.createElement("img"); img.src = selectedImage; // 將圖片添加到頁面 document.body.appendChild(img); </script> </body> </html>
以上代碼中,我們首先定義了一個圖片數組,包括所有要展示的圖片文件。然后我們使用JavaScript的Math.random()函數生成一個隨機數,根據隨機數和數組長度計算出在數組中應該選擇哪一張圖片。接著,我們創建一個img元素,并將選中的圖片文件名賦值給它的src屬性。最后,我們將img元素添加到頁面中,圖片就可以隨機展示了。
需要注意的是,如果要展示多張圖片,可以在數組中添加更多文件名,并修改JavaScript代碼將圖片添加到不同的位置。
上一篇mysql讀入txt
下一篇mysql讀什么