JavaScript如果/else语句可以将放大的图像返回其默认大小

Question

我是本网站的新手和一般编码。我很难在被单击放大后尝试获取图像以缩小其"小"尺寸。

这是我的HTML元素：

<img src="http://image.com/123.jpg"
id="smart_thumbnail"
class="small"

这个ID和类无法更改，因为它是用于分配的。"小"类自动将图像变成缩略图。它在单击时会放大，但是我无法通过再次单击它来返回其"小"状态。必须使用if/else语句完成。

这是给定的JavaScript模板：

document.addEventListener("DOMContentLoaded", function(event) {
    var thumbnailElement = document.getElementById("smart_thumbnail");
    thumbnailElement.addEventListener("click", function() {
        thumbnailElement.className = "";
    });
});

双引号是"放大"类。

谢谢您，如果这篇文章不符合本网站所需的格式，我深表歉意。我还到处搜索了此解决方案，但找不到我的一生。

Answer 1

这可以使用dom classList属性：

完成

thumbnailElement.classList.toggle("small");

如果存在元素，这将从元素中删除small类，否则会添加它。