CSS 속성을 추가하는 방법 - .css()

css로 선택한 요소의 css 속성값을 가져오거나 style 속성을 추가합니다.
1 min read

.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()을 사용합니다.

You may like these posts

Post a Comment