在前端開發中,點贊是常見的功能之一。而在 HTML 中,可以利用 JavaScript 實現點贊加一的功能。以下為點贊加一的 HTML 代碼:
<button id="likeBtn" onclick="addOne()"> Like <span id="likeCount">0</span> </button>
在上述代碼中,首先使用 button 標簽創建一個按鈕,并為其賦予 id 屬性。然后在按鈕內部添加文字 “Like”,并創建一個 span 標簽,用來顯示點贊數。span 標簽的 id 為 “likeCount”,初始值為 0。按鈕的 onclick 事件指向 JavaScript 函數 addOne(),該函數用于實現點贊加一的操作。
<script> function addOne() { var count = document.getElementById("likeCount"); var currentValue = parseInt(count.textContent); count.textContent = currentValue + 1; } </script>
在上述代碼中定義了一個名為 addOne() 的函數,該函數在按鈕被點擊時觸發。在函數內部,首先通過 getElementById() 方法獲取顯示點贊數的 span 標簽,然后獲取當前點贊數的值并將其轉換為整數。最后將該值加一并更新到 span 標簽的 innerText(或 textContent)屬性中,完成點贊加一的操作。
以上便是實現 HTML 點贊加一功能的代碼。值得注意的是,這只是最基本的實現方式,其它高級功能(如禁用重復點贊、使用 Ajax 異步加載等)則需要更復雜的代碼和后端支持。
上一篇html的代碼是什么