본문 바로가기

웹개발/javascript

[javascript]동적으로 css(style) 변경하기

반응형

동적으로 css변경하기

 

엘리먼트.style.”변경할속성”

 

ex)

<html>
    <head>
        <script>
            function change_color(val){
                var element = document.getElementById("rs_div");
                if(val=="red") element.style.color = "#ff0000";
                else if(val=="blue") element.style.color = "#0000ff";
                else if(val=="yellow") element.style.color = "#ffff00";   
            }
        </script>
    </head>
    <body>
        <input type="button" value="red" onclick="change_color(this.value)" />&nbsp;&nbsp;&nbsp;
        <input type="button" value="blue" onclick="change_color(this.value)" />&nbsp;&nbsp;&nbsp;
        <input type="button" value="yellow" onclick="change_color(this.value)" />&nbsp;&nbsp;&nbsp;
        <div id="rs_div">색깔은?</div>
    </body>
</html>

반응형