Wie man! Wichtig in jquery einbezieht

Ich versuche,! CSS-Attribut mit jQuery like hinzuzufügen

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

aber! wichtig hat keine Wirkung. Wie kann man! Wichtig in jquery aufnehmen?

Anscheinend ist dies in jQuery möglich:

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

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

Ich habe dieses Problem gelöst mit:

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

Es geht also kein Inline-Style verloren, der letzte überschreibt den ersten

Es ist auch möglich, wichtigere Eigenschaften hinzuzufügen:

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

var tabsHeight = 650;

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

ODER

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

dann

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

Wenn Sie jquery verwenden müssen! Wichtig für mehr als einen Artikel, würden Sie dies so tun.

Setzen Sie beispielsweise die imgTags max-width und max-height auf jeweils 500px

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

Für die Zeiten, in denen Sie jquery verwenden müssen, um! Wichtige Eigenschaften festzulegen, ist hier ein Plugin, das ich erstelle und das Ihnen dies ermöglicht.

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

Wenn Sie wirklich CSS überschreiben müssen, das! Wichtige Regeln enthält, zum Beispiel in einem Fall, auf den ich kürzlich gestoßen bin, ist das Überschreiben eines WordPress-Themas erforderlich! Wichtige SCSS-Regeln, um das Thema zu brechen, aber da ich meinen Code mit Webpack und transpiliert habe (Ich nehme an, dies ist der Grund -) Mein CSS kam nach dem transpilierten Javascript in die Kette. Sie können Ihrem Stylesheet eine separate Klassenregel hinzufügen, die die erste! Wichtige Regel in der Kaskade überschreibt, und die schwergewichtete Klasse eher umschalten als CSS dynamisch anpassen. Nur ein Gedanke.

Sie müssen !importantCSS nicht mit jQuery ändern, da es das styleAttribut für die Elemente im DOM direkt ändert . !importantwird nur in Stylesheets benötigt, um zu verhindern, dass eine bestimmte Stilregel auf einer niedrigeren Ebene überschrieben wird. Ändern styledirekt ist die unterste Ebene Sie gehen können, so !importanthat keine Bedeutung.