jQuery css 메소드로 style 수정시 !important는 적용이 안됩니다.

jQuery css 메소드로 style 수정시 !important는 적용이 안됩니다.

publish date
Jun 30, 2020
Tags
js
jquery
jQuery로 아래와 같이 css style을 강제적으로 적용하는 !important 를 설정하는 경우
$('div').css('color', '#eee !important');
예상과는 달리 !important 가 적용이 안될뿐만 아니라 color: #eee 도 적용되지 않습니다.
 
아마 !important 까지 css sytle value 값으로 인식하고 처리하려다 보니 올바른 값이 아닌 것으로 판단되어 무시되는 듯 싶습니다.( 해당 메소드를 분석해보진 않아서 추측일 뿐 정확한 이유는 아닐 수 있습니다. )
 
굳이 강제적으로 스타일을 적용해야하는게 아니라면 !importatn를 빼고 $(‘div’).css(‘color’, ‘#eee’); 와 같이 사용하면 되는데요.
 
그렇다면 어떻게 해야 important를 적용할 수 있느냐?
 
간단히 아래와 같이 attr 메소드를 사용하시면됩니다.
$('div').attr('style', 'color: #eee !important');
감사합니다. 😄