jQueryを使用して、特定のフォントファミリのヘッダーにCSSプロパティを適用しますか？

Question

私はサイト全体のヘッダータグに使用されている2つの異なるフォントを含むカスタムWordpressのテーマに取り組んでいます。 1つのフォントは筆記体であり、通常のtext-transformプロパティを持つ必要があります。他のフォントは常にtext-transform:uppercase;に表示する必要があります。

筆記体フォントにも適用されるので、私はtext-transform:uppercase;をすべてのヘッダータグに適用できません。

Wordpressのため、クライアントはTinyMCEでヘッダーを追加し、フォントファミリをケースバイケースで変更することができるため、クラスにはにも適用される筆記体フォントを適用することもできます。

jQueryを使用して特定のフォントファミリーのものに 'text-transform'プロパティを適用する方法があるのだろうかと思いましたか？

ので、例えば、私はfont-family:"Cinzel";もそれに適用されるtext-transform:uppercase;を持っていますが、font-family:"Dancing Script";を持つ任意のヘッダがtext-transform:normal;維持する必要があるためにある任意のヘッダを持っていると思います。

Answer 1

あなただけのフォントファミリをベースに、ヘッダータグをフィルタリングして、

$('header').filter(function() { 
 
    return $(this).css('font-family').replace("'",'') === 'Cinzel'; 
 
}).css('text-transform', 'uppercase');

.cinz {font-family : "Cinzel"}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<header class="cinz">this should be uppercase</header> 
 
<header>this shouldn't</header>