0

初期調査

.css()特定の要素のCSSルールを取得および設定するためにを使用することを認識しています。私はこのCSSのウェブサイトを見ました:

body, table td, select {
    font-family: Arial Unicode MS, Arial, sans-serif;
    font-size: small;
}

私はArial Unicodeフォントとして好きではありませんでした。まあ、それは私の個人的な感触でした。そのため、Chromeのスタイルインスペクターを使用して、好きなものを編集しますArial Unicode MSSegoe UIとにかく、同じことを達成するために以下を使用する以外にありますか?

ケースI

$("body, table td, select").css("font-family", "Segoe UI");
  • 再帰的でパフォーマンスを重視します。
  • 物事がその場でロードされている場合は機能しません。

ケースII

$('<style>body, table td, select {font-famnily: "Segoe UI";}</style>')
    .appendTo("head");
  • これよりも良い方法はありますか?
  • たくさんの<style>タグを作成します!
4

2 に答える 2

5

OK、もし:

  • 個人の好み

    次に、ユーザースタイルのCSSを使用します。優先順位に従って、ユーザースタイルは他のすべてのスタイルよりも優先されます。次に、インラインスタイル、!importantスタイル、特異性、デフォルトのブラウザスタイルの順になります。個人的な好みの場合は、カスタムCSSとそれをサポートするブラウザーをパックします。

  • あなたは開発者です

    次に、JavaScriptまたはユーザースクリプトでこれを行わないでください。問題に行き、それらのスタイルを変更してください!不要なものを実際に解析することで、ブラウザをより機能させるだけです。コードにアクセスできるので、代わりにスタイルを変更してください。

    ただし、サイトは公開サイトである可能性があるため、一般的にすべての人に適したスタイルにします。サイトを閲覧しているのはあなただけではありません。

  • 開発者ではありません:

    私が考えることができる最善の方法(そして以前にこれを行った*)は、ページから外部スタイルシートを削除し、それらを自分の好みの変更されたバージョンに置き換えることです。つまり、元のCSSファイルのコピーを取り、変更が必要なものを変更して<link>から、その外部ファイルを作成してJS経由でロードするか、AJAX経由でコンテンツをロードしてに配置します<style>。ただし、このアプローチには障害がたくさんあります。<link>にはonloadイベントがないため、外部CSSがロードされたことがわかりません(ただし、巧妙な回避策があります)。CSSコンテンツをAJAXすることは、CSSが同じドメインにあるか、ブラウザーとサーバーがCORSをサポートしていることを意味します。

    これを行うもう1つの方法は、JSにロードされたスタイルシートを調べて、その内容を変更させることです。JSはCSS宣言の山で変更する定義を探すため、これはよりJSを集中的に使用する作業です。これはより安全な方法ですが、すべてのブラウザーがCSSスタイルをトラバースできるわけではなく、少なくともブラウザー間で異なる方法でトラバースできるわけではないと思います。また、大きなスタイルシートを入手した場合は、毎回解析することになります。

    あなたが言った.css()ように、再帰的になります。影響を受ける各要素にインラインスタイルを適用するため、Trueです。これは、インラインスタイルの優先度が高いという意味で優れ.css()ているため、を使用して配置されたものが何であれ、それらが有効になることはほぼ確実です。ただし、現在DOMが関係しているため、より多くの作業が必要になります。

*私が作成したライブラリは、既存のスタイルを削除せず、APIを使用して宣言された事前定義されたスタイルをロードおよびアンロードするだけです。

于 2012-11-17T14:29:44.193 に答える
1

見て:

そのためのライブラリがないのではないかと思います。本当に見たいです...

于 2012-11-17T13:46:45.250 に答える