これはかなり学術的な質問です。CSSセレクターを特定のDOM要素にマップするために使用されるデータ構造またはアルゴリズムのように、ブラウザーがどのように実装されているのか疑問に思っています。ハッシュテーブルを介して達成されますか? DOM 子ノードは、親に適用されるスタイルがそれ自体にも適用されることなどをどのように認識しますか? Mozilla デベロッパー センターを見てきましたが、何も見つかりませんでした。この件に関するドキュメントや本は大歓迎です...ありがとう!
4 に答える
マッチングは、「どのノードがセレクターに一致するか」ではなく、「どのセレクターが特定のノードに一致するか」という質問に答えます。これにより、現在のノードに対してセレクターの各部分を簡単に評価できます (ノード名/ID/クラスを比較します)。子孫コンビネータと継承は、親ノードのスキャンによって行われます。
次に何が起こるかに興味がある場合は、WebKit ブログに素晴らしいシリーズがありました: WebCore レンダリングの基本
したがって、ここに希少なドキュメントがあります:
- http://www.mozilla.org/newlayout/doc/style-system.html
- https://developer.mozilla.org/en/Mozilla_Style_System
あなたの質問から、まず CSS がどのように機能するか (たとえば、ルールの特異性、計算されたスタイルとは何か) についてもっと学ぶ必要があるようです。
あなたは Mozilla に言及しています。すべての可能な実装の抽象的な概念ではなく、特定の具体的な実装のコンテキストで質問に答える方が確かに簡単です。
[どのようなデータ構造またはアルゴリズムを使用して、CSS セレクターを特定の DOM 要素にマップしますか?それはハッシュ テーブルを介して実現されますか?
あなたの質問に対する直接的な答えは、FF2 については、Firefox ソース コードのスタイル ディレクトリにある可能性が高いと思います。そのディレクトリ内で「hashtable」を検索すると、111 件の結果が 7 ファイルになります。
ハッシュテーブルは、CSS スタイルのレンダリングに関連するいくつかのプロセスに広く関連付けられていると確信しています。
したがって、あなたの質問に対する簡単な答えは、「はい、しかし、ハッシュ テーブルだけではありません」です。
W3C は、私が参考になる定義の観点からの一般的なアプローチを提供します。