CSS可以很方便地改變?cè)氐臉邮剑ū尘邦伾O旅嫖覀儊韺W(xué)習(xí)如何通過CSS實(shí)現(xiàn)點(diǎn)擊后改變?cè)氐谋尘邦伾?/p>
/* 首先定義一個(gè)類,用于點(diǎn)擊后改變背景顏色 */ .change-color { background-color: red; /* 初始背景顏色為紅色 */ }
接下來,我們需要通過JavaScript來實(shí)現(xiàn)點(diǎn)擊后添加或刪除該類。
// 獲取需要添加類的元素 var element = document.getElementById("myElement"); // 監(jiān)聽鼠標(biāo)點(diǎn)擊事件 element.addEventListener("click", function(){ // 判斷元素是否已有該類,如果有,則移除該類,如果沒有,則添加該類 if(element.classList.contains("change-color")){ element.classList.remove("change-color"); } else { element.classList.add("change-color"); } });
這樣,當(dāng)我們將以上代碼添加到HTML文件中,并給需要點(diǎn)擊的元素添加id屬性(比如id="myElement"),就能實(shí)現(xiàn)點(diǎn)擊后改變背景顏色的效果了。