.css()
.css()로 선택한 요소의 css 속성값을 가져오거나 style 속성을 추가합니다.
기본형 1
.css( propertyName )
속성값을 가져옵니다. 예를 들어
$( "h1" ).css( "color" );
는 <h1>
요소의 스타일 중 color 속성의 값을 가져옵니다.
기본형 2
.css( propertyName, value )
style 속성을 추가합니다. 예를 들어
$( "h1" ).css( "color", "green" );
는 h1 요소에 style 속성을 추가하여 글자색을 녹색으로 바꿉니다.
<h1 style="color: green;">...</h1>
예제 1
<h1>
요소의 color 속성의 값을 출력합니다.
<h1>Lorem ipsum dolor.</h1>
<p></p>
h1 {
color: red;
}
$(document).ready(function() {
var color = $( "h1" ).css( "color" );
$( "p" ).html( "Color is " + color );
});
예제 2
<h1>
요소의 글자색을 녹색으로 만듭니다.
<h1>Lorem ipsum dolor.</h1>
h1 {
color: red;
}
$( document ).ready( function() {
$( "h1" ).css( "color", "green" );
});
같이 보면 좋은 글
- HTML 요소(element)의 속성(attribute)의 값을 가져오거나 속성을 추가할 때는 .attr()을 사용합니다.