css - 使用 Javascript 在点击时更改超过 1 个 CSS 值？

Question

我正在处理一个非常基本的页面，其中包含缩略图和主图像。单击缩略图图像时，我正在使用 document.getElementById 更改主图像。很容易做到，但我现在想将我的主要图像从横向更改为纵向。这意味着现在单击缩略图时，我不仅需要更改主图像，还需要更改 div 标签尺寸。我是 Javascript 的新手，想知道是否有人可以快速指出正确的方向来解决这个问题。

预先感谢您的任何帮助，

马盖特

Answer 1

您可以在 onclick 事件中使用分号并添加更多 javascript 调用，或者创建一个 JavaScript 函数来执行所有必要的更改并从 onclick 事件中调用该方法。

    function changeStuff(){
       document.getElementById("myThing").DoStuff()
       document.getElementById("myOtherThing").DoOtherStuff()
    }

    <div id="myThing">
        <img id="myOtherThing" onclick="cangeStuff();"></img>
    </div>

Answer 2

我建议在元素上添加/更改 CSS 样式类，然后使用所有必要的修改配置该类。你可以用 CSS 做很多事情。