jquery에! important를 포함하는 방법

jquery에! important를 포함하는 방법

---

jQuery를 사용하여 css 속성에! important를 추가하려고합니다.

$("tabs").css('height','650px;!important');

그러나! important는 효과가 없습니다. jquery에! important를 포함하는 방법은 무엇입니까?

---

분명히 jQuery에서 이것을 할 수 있습니다.

$("#tabs").css("cssText", "height: 650px !important;");

Src : http://bugs.jquery.com/ticket/2066

---

이 문제를 다음과 같이 해결했습니다.

inputObj.css('cssText', inputObj.attr('style')+'padding-left: ' + (width + 5) + 'px !IMPORTANT;');

따라서 인라인 스타일이 손실되지 않고 마지막이 첫 번째

---

더 중요한 속성을 추가 할 수도 있습니다.

inputObj.attr('style', 'color:black !important; background-color:#428bca !important;');

---

jquery가 두 개 이상의 항목에 대해! important를 사용하도록해야하는 경우 이것이 수행하는 방법입니다.

예 : img태그 max-width 및 max-height를 각각 500px로 설정

$('img').css('cssText', "max-width: 500px !important;' + "max-height: 500px !important;');

---

var tabsHeight = 650;

$("tabs").attr('style', 'height: '+ tabsHeight +'px !important');

또는

#CSS
.myclass{height:650px !important;}

그때

$("tabs").addClass("myclass");

---

jquery를 사용하여! important 속성을 설정해야하는 경우, 여기에 그렇게 할 수있는 플러그인이 있습니다.

$.fn.important = function(key, value) {
    var q = Object.assign({}, this.style)
    q[key] = `${value} !important`;
    $(this).css("cssText", Object.entries(q).filter(x => x[1]).map(([k, v]) => (`${k}: ${v}`)).join(';'));
};

$('div').important('color', 'red');

---

예를 들어 내가 최근에 만난 경우와 같이! 중요한 규칙이있는 CSS를 재정의해야하는 경우, 테마를 깨기 위해 워드 프레스 테마를 재정의하려면! 중요한 scss 규칙이 필요했지만 웹팩으로 코드를 트랜스 파일하고 (이것이 이유라고 생각합니다-) 내 CSS가 트랜스 파일 된 자바 스크립트 이후 체인에 포함되었으므로 캐스케이드에서 첫 번째! 중요한 규칙을 재정의하는 별도의 클래스 규칙을 스타일 시트에 추가하고 더 무거운 가중치 클래스를 토글 할 수 있습니다. CSS를 동적으로 조정하는 것보다. 그냥 생각.

---

!importantjQuery로 CSS를 수정할 때는 styleDOM의 요소에 대한 속성을 직접 수정하므로 필요하지 않습니다 . !important특정 스타일 규칙이 하위 수준에서 재정의되는 것을 허용하지 않으려면 스타일 시트에서만 필요합니다. style직접 수정 하는 것은 가장 낮은 수준이므로 !important의미가 없습니다.

참고 URL : https://stackoverflow.com/questions/1986182/how-to-include-important-in-jquery