HTML點擊切換文字內容特效代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>點擊切換文字內容</title>
<style>
#text {
font-size: 30px;
margin: 50px;
cursor: pointer;
}
</style>
</head>
<body>
<div id="text">點擊切換文字內容</div>
<script>
var text = document.getElementById("text");
var arr = ["第一段文字", "第二段文字", "第三段文字"];
var index = 0;
text.onclick = function() {
text.innerHTML = arr[index];
index++;
if (index == arr.length) {
index = 0;
}
}
</script>
</body>
</html>以上代碼實現了點擊切換文字內容的特效。其中，使用了div標簽來創建了一個id為"text"的元素，并在CSS中對其進行樣式設置，使其具有了點擊的效果；而JavaScript代碼則定義了一個包含多段文字內容的數組，并在點擊事件中根據數組下標依次顯示不同的文字。通過這種實現方式，可以提高網頁的交互性和用戶體驗，確保用戶在瀏覽網頁時可以得到更好的感受。