百度前端训练营预习内容

在页面中显示“Hello World！”以及两个按钮，点击“变为红色”按钮可以改变文字颜色为红色，点击“复原”按钮颜色恢复为默认颜色。

<style>
    .d2{
        color: red;
    }
</style>
<center>
    <div class="main">
        <h1 id="d1" class="d1">hello world</h1>
        <button onclick="changeRed()">变成红色</button>
        <button onclick="resetH()">复原</button>
    </div>
</center>
<script>
    function changeRed() {
        let obj = document.getElementById("d1");
        obj.classList.add("d2");
    }
    function resetH() {
        let obj = document.getElementById("d1");
        obj.classList.remove("d2");
    }
</script>

核心js语法

obj.classList.add("类名");//添加类
obj.classList.remove("类名");//删除类