Web開(kāi)發(fā)中有很多常用的網(wǎng)頁(yè)元素，其中一個(gè)是點(diǎn)贊功能。點(diǎn)贊功能是很多社交媒體平臺(tái)必不可少的元素。下面是我記錄的HTML點(diǎn)贊代碼示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>點(diǎn)贊</title>
<style>
/* 點(diǎn)贊按鈕的樣式 */
.like-btn {
display: inline-block;
padding: 10px;
border-radius: 10px;
background-color: lightgray;
cursor: pointer;
}
/* 點(diǎn)贊后的樣式，可以根據(jù)自己的需求修改 */
.liked {
background-color: pink;
font-weight: bold;
}
</style>
</head>
<body>
<div id="like-container">
<span id="like-count">0</span>
<button id="like-btn" class="like-btn" onclick="like()">點(diǎn)贊</button>
</div>
<script>
const likeCount = document.querySelector("#like-count");
const likeBtn = document.querySelector("#like-btn");
let counter = 0;
function like() {
counter++;
likeCount.innerText = counter;
likeBtn.classList.toggle("liked");
}
</script>
</body>
</html>以上代碼中，使用了HTML、CSS和JavaScript來(lái)實(shí)現(xiàn)點(diǎn)贊功能。頁(yè)面中有一個(gè)按鈕，當(dāng)用戶點(diǎn)擊按鈕時(shí)，點(diǎn)贊數(shù)會(huì)增加，同時(shí)按鈕的外觀也會(huì)發(fā)生變化，以提示用戶當(dāng)前狀態(tài)。