jQuery .css()를 사용하여 !important를 적용하는 방법

 

질문 : .css ()를 사용하여 !important를 적용하는 방법은 무엇입니까?

---

!important 스타일을 적용하는 데 문제가 있습니다. 난 노력 했어:

$("#elem").css("width", "100px !important");

이것은 아무것도 하지 않습니다. 너비 스타일이 전혀 적용되지 않습니다. cssText 를 덮어 쓰지 않고 그러한 스타일을 적용하는 jQuery 방식이 있습니까 (먼저 파싱해야 함을 의미합니다)?

편집 !important 스타일 인라인으로 재정의하려는 !important 스타일의 스타일 시트가 .width() !important 스타일에 의해 재정의되기 때문에 작동하지 않습니다. .

또한 이전 값을 재정의 할 값 이 계산 되므로 단순히 다른 외부 스타일을 만들 수 없습니다.

답변

---

문제는 jQuery가 !important 속성을 이해하지 못하여 발생하므로 규칙을 적용하지 못합니다.

addClass() 를 통해 참조하여 규칙을 적용 할 수 있습니다.

.importantRule { width: 100px !important; }

$('#elem').addClass('importantRule');

attr() 사용하여 :

$('#elem').attr('style', 'width: 100px !important');

그러나 후자의 접근 방식은 이전에 설정된 인라인 스타일 규칙을 설정 해제합니다. 따라서주의해서 사용하십시오.

물론 @Nick Craver의 방법이 더 쉽고 현명하다는 좋은 주장이 있습니다.

위의 attr() style 문자열 / 속성을 유지하기 위해 약간 수정되었으며 주석에서 falko 가 제안한대로 수정되었습니다.

$('#elem').attr('style', function(i,s) { return (s || '') + 'width: 100px !important;' });

출처 : https://stackoverflow.com/questions/2655925/how-to-apply-important-using-css