色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

html點擊切換圖片效果代碼

html
榮姿康1年前8瀏覽0評論
HTML點擊切換圖片效果是一種簡單但是很實用的功能，它可以輕松實現在一個div區域內使用鼠標點擊來切換不同的圖片。下面是一個實現該功能的代碼示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>點擊切換圖片</title>
<script>
function changeImg() {
var img = document.getElementById("myImg");
if (img.src.match("img1")) {
img.src = "img2.jpg";
} else {
img.src = "img1.jpg";
}
}
</script>
</head>
<body>
<div>
<p>點擊下面的圖片進行切換：</p>
<img id="myImg" src="img1.jpg" onclick="changeImg()">
</div>
</body>
</html>
在這個代碼示例中，我們使用了一個名為"changeImg"的函數來實現圖片的切換效果。通過在"onclick"事件上綁定該函數，我們能夠在用戶單擊圖片時觸發該事件。在函數中，我們首先使用document.getElementById方法來獲取該圖片，并且使用其src屬性來檢查當前顯示的圖片是哪一個。如果當前顯示的圖片是img1，我們就將它的src屬性設置為img2，反之則設置為img1。 在頁面中，我們還包含了一個div容器，用來裝載圖片和一段說明文字。通過在img標簽上綁定"onclick"事件，當用戶單擊圖片時，頁面將自動調用changeImg函數，并根據用戶當前看到的圖片來切換下一張。使用這種方式，我們可以輕松實現圖片切換的效果，并且不需要任何的JavaScript代碼或圖片預加載。