Wie überschreibe ich !important-Stilregeln in JavaScript?

Überschreiben von !important-Stilregeln in JavaScript

Wenn Sie versuchen, das Erscheinungsbild eines HTML-Elements zu ändern, stoßen Sie möglicherweise auf !important-CSS-Deklarationen, die scheinbar Überschreibungen durch JavaScript verhindern . Das kann frustrierend sein, aber es ist möglich, diese wichtigen Regeln zu umgehen.

Inline-Attribut verwenden

Eine Methode besteht darin, dem ein „Stil“-Attribut direkt zuzuweisen Element. Dieses Stilattribut sollte die gewünschte Eigenschaft und den gewünschten Wert enthalten. Durch Anhängen von !important an den Wert können Sie die externe !important-Deklaration überschreiben.

element.setAttribute('style', 'display:inline !important');

CSS-Texteigenschaft ändern

Alternativ können Sie den Stil des Elements ändern Die „cssText“-Eigenschaft des Objekts. Diese Eigenschaft enthält den gesamten CSS-Code des Elements. Indem Sie dieser Eigenschaft einen neuen CSS-Code zuweisen, können Sie die vorhandenen Stile einschließlich aller !important-Regeln überschreiben.

element.style.cssText = 'display:inline !important';

Verwenden des jQuery-Plugins

Zur Vereinfachung Als Lösung können Sie mein jQuery-Plugin namens „important“ verwenden, das auf GitHub verfügbar ist. Dieses Plugin bietet zusätzliche Funktionen zum Bearbeiten wichtiger Regeln in Elementen.

setProperty-Methode

Zusätzlich bietet CSSOM (CSS Object Model) eine Methode namens „setProperty“, die dies ermöglicht Sie können CSS-Eigenschaften mit einer bestimmten Priorität festlegen. Mit dieser Methode können Sie !important-Regeln überschreiben.

element.style.setProperty('background-color', 'red', 'important');

Mit jeder dieser Methoden können Sie !important-Stilregeln mit JavaScript erfolgreich überschreiben.

Das obige ist der detaillierte Inhalt vonWie überschreibe ich !important-Stilregeln in JavaScript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!