jQuery を使用して CSS 疑似要素のスタイル プロパティにアクセスするにはどうすればよいですか?

jQuery を使用した疑似要素のスタイル プロパティへのアクセス

CSS ルールを通過する際の制限を考慮して、この記事では、jQuery セレクターを使用して、擬似要素による特定の効果を持つ要素rules.

たとえば、選択的に変更できる要素:

.commentarea .author:before {
    background-image: url(http://...);
    background-position: -9999px -9999px;
}

を考えてみましょう:

.author[href$="gbacon"]:before /* ... */ {
  content: "";
  background-position: 0 -140px
}

デフォルトの背景位置を持つ疑似要素を選択するには、次のセレクター構文は機能しません:

$(".commentarea .author:before")

同様に、を使用しようとします特定の背景画像を持つ要素を検索する .siblings() は空の結果を返します。

問題の核心は、疑似要素の性質にあります。これらには独立したセレクターはなく、代わりに周囲の要素を変更します。つまり、:before と :after は選択しません。

たとえば、HTML:

<span></span>

および CSS:

.a .b:before {
    content: "|Inserted using :before|";
}

テキスト「|Inserted using :before|」クラス b はクラス a の子孫であるため、内側のspan要素の前に挿入されます。これは、擬似要素には独自のセレクターはなく、その親要素に影響を与えることを示しています。

したがって、標準の jQuery セレクター構文を使用して擬似要素を直接選択することはできません。考えられる解決策の 1 つは、jQueryRule (http://flesler.blogspot.com/2007/11/jqueryrule.html) のような jQuery プラグインを利用して、元の CSS ルールを抽出することです。

以上がjQuery を使用して CSS 疑似要素のスタイル プロパティにアクセスするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。