itsource

jquery에 !important 포함하는 방법

mycopycode 2023. 10. 19. 22:18
반응형

jquery에 !important 포함하는 방법

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

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

하지만 !important는 영향을 주지 않습니다.jquery에 중요한 !을 포함시키는 방법은?

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;');

따라서 inline-Style이 손실되지 않고 마지막이 첫 번째를 재정의합니다.

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

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

var tabsHeight = 650;

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

오어

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

그리고나서

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

둘 이상의 항목에 대해 jquery use !important가 필요한 경우 이렇게 수행합니다.

예를 들면 을 정합니다img최대 너비 및 최대 높이 태그를 각각 500 px로 지정합니다.

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

jquery를 사용하여 !important properties를 설정해야 할 때를 위해 여기 제가 구축한 플러그인이 있습니다.

$.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');

예를 들어, 최근에 우연히 발견한 경우 워드프레스 테마를 재정의하려면 !중요한 sscs 규칙을 재정의해야 합니다. 그러나 웹팩으로 코드를 변환하고 있었기 때문에 --) 변환된 자바스크립트 후에 내 cs가 체인에 추가되었기 때문에 as를 추가할 수 있습니다.cascade의 첫 번째 !important 규칙을 재정의하는 스타일시트의 클래스 규칙을 분리하고 css를 동적으로 조정하는 대신 무거운 클래스를 전환합니다.생각일 뿐이야.

필요없습니다!importantjQuery로 CSS를 수정할 때는styleDOM의 요소에 직접 속성을 부여합니다.!important특정 스타일 규칙을 하위 수준에서 재정의할 수 없도록 하기 위해 스타일시트에서만 필요합니다.수정style직접적으로 당신이 갈 수 있는 가장 낮은 수준입니다.!important의미가 없습니다.

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

반응형