H 5基礎知識第十一課(className属性)

5634 ワード

<style>
    .style1{
        width: 200px;
        height: 200px;
        border: solid 1px red;
    }
    .style2{
        background-color: #00b8e9;
        position: absolute;
        right: 10px;
    }

style>

<body>
<div class="style1" id="div1">div1div>


<button id="change"> button>


body>
<script>
    var change = document.getElementById("change");
    change.addEventListener("click", function () {

        var div=document.getElementById("div1");
                div.className += " style2";
//        className   class  
// div.style.width = "500px";// div.style.backgroundColor = "red"; div.style.cssText="font-size=50 px;color=red"/* ずセミコロン*/});script>