使用<i>标签在单击时更改图标可以通过以下步骤实现:
<i id="icon" class="fa fa-star"></i>
这里使用了Font Awesome图标库的一个星星图标作为示例。
var icon = document.getElementById("icon");
icon.addEventListener("click", function() {
// 在这里编写更改图标的代码
});
icon.addEventListener("click", function() {
if (icon.classList.contains("fa-star")) {
icon.classList.remove("fa-star");
icon.classList.add("fa-heart");
} else {
icon.classList.remove("fa-heart");
icon.classList.add("fa-star");
}
});
这段代码会在每次点击<i>标签时,切换图标的样式,从星星图标变为心形图标,再变回星星图标。
这是一个简单的示例,实际应用中可以根据具体需求进行更复杂的图标更改操作。腾讯云没有提供直接相关的产品和产品介绍链接地址。
领取专属 10元无门槛券
手把手带您无忧上云