jQuery에서 하이픈이 있는 CSS 속성

CSS에서 흔히 그렇듯이, 속성이 하이픈으로 구분된 여러 단어로 구성되어 있다고 가정해 보겠습니다:

html<p class="www">text</p>

이 경우에는 아무런 문제가 없습니다. 이 속성은 Javascript 코드에서도 CSS와 동일하게 작성됩니다:

javascript$('.www').css('font-size', '20px');

여러 CSS 속성을 설정하려는 경우, css 메서드에 객체를 매개변수로 전달할 수 있습니다. 이 객체의 키는 CSS 속성이고, 객체의 값은 CSS 속성의 값입니다:

javascript$('.www').css({color: 'red', font: '12px Arial'});

그러나, 여기서는 font-size와 같은 속성에 문제가 발생합니다. font-size라고 쓰는 것이 아니라, fontSize라고 작성해야 합니다:

javascript$('.www').css({color: 'red', fontSize: '12px'});

이런 방식이 마음에 들지 않는다면, font-size 키를 따옴표로 묶으십시오:

javascript$('.www').css({color: 'red', 'font-size': '12px'});

보시다시피, jQuery는 사용자의 선호도에 따라 다양한 메서드 사용 옵션을 제공합니다. 자신에게 더 편리한 것을 사용하십시오.