javascript - 使用 Javascript 更改类值

Question

我想做一个按钮来将布局从宽布局更改为盒装布局，从 class="container"至class="container-fluid" ，是否可以通过Javascript更改它们？如果是，我该怎么做？

Answer 1

使用document.getElementById("myEle").className更改类。下面代码中的类仅具有背景颜色。您可以使用自己的 css 来代替它们。

function changeClass(){
  document.getElementById("myEle").className = "container-fluid";
}

<style>
.container{
  background: yellow;
}
.container-fluid{
  background: red;
}
</style>
<div class="container" id="myEle">Hello World</div>
<button onClick="changeClass()">Change class</button>