ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript でインライン `! important` スタイルをオーバーライドするにはどうすればよいですか?

JavaScript でインライン `! important` スタイルをオーバーライドするにはどうすればよいですか?

Susan Sarandon
Susan Sarandonオリジナル
2024-12-11 13:14:11208ブラウズ

How Can I Override Inline `!important` Styles with JavaScript?

JavaScript によるインライン ! important スタイルのオーバーライド

jQuery の .css() メソッドは、! important 属性でマークされたスタイルを適用しません。これは、!重要な要素を含む既存のインライン スタイルをオーバーライドしようとするときにイライラする可能性があります。

解決策:

次のいずれかの方法を使用して、この制限を克服してください:

  1. クラスで addClass() を使用するルール:

    • 目的の CSS クラスを作成します!重要なスタイル:

      .importantRule { width: 100px !important; }
    • クラスをターゲットに適用します要素:

      $('#elem').addClass('importantRule');
  2. attr() を使用してインライン スタイルを設定します:

    • このメソッドは既存のインラインを上書きします。スタイル:

      $('#elem').attr('style', 'width: 100px !important');
    • 既存のインライン スタイルを保持するには、次の修正バージョンを使用します:

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

以上がJavaScript でインライン `! important` スタイルをオーバーライドするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。