How CSS and DOM is implemented in the browser?

Question

This is a pretty academic question. I'm wondering how the browser is implemented as in what data structure or algorithm is used to map a CSS selector to a particular DOM element. Is it accomplished through a hash table? How does DOM child node knows that the style applied to parent also applies to itself etc. I've been looking at Mozilla developer center and haven't found anything. Any documentations or books on the subject would be much appreciated... thanks!

Answer 1

Matching answers question "which selectors match given node", not "which nodes match a selector". This lets you simply evaluate each part of a selector against current node (compare node name/ID/class). Decendant combinator and inheritance are done through scanning of parent nodes.

If you're interested what happens next, WebKit blog had nice series: WebCore rendering basics