JavaScript - jQuery style 속성 설정. css()

CSS 속성 추가하기

ex>
엘리먼트.style["background-color"] = "yellow";

엘리먼트.style["이름"] = 추출
엘리먼트.style["이름"] = 값 : 설정

css(이름, 값) : 설정
css(이름) : 추출
css({객체}) : 설정

 

HTML 소스

<button id="btn1">설정하기</button>
<button id="btn2">가져오기</button>
<div id="div1">CSS 라이브러리 테스트</div>
<div id="div2">CSS 라이브러리 테스트</div>

 

스크립트 소스

<script>
    $("#btn1")[0].addEventListener("click", function () {
        // 메서드 체이닝 사용
        $("#div1").css("background", "tomato")
            .css("color", "white")
            .css("fontSize", "50px")
            .css("border", "5px solid black");

        $("#div2").css({
                background: "orange",
                color: "blue",
                border: "5px solid black" 
                });
    });

    $("#btn2")[0].addEventListener("click", function () {
        console.log($("#div1").css("color"));
        console.log($("#div2").css("background"));
    });
</script>

 

결과