Http://www.jjos.org/%E4%BA%92%E8%81%94%E7%BD%91/%E6%B5%8F%E8%A7%88%E5%99%A8/2010/05/10/308_webkit-webkit-major-objects.html
When WebCore loads and displays a page, many objects are created to correspond to each element in the page. Who created and managed the relationships between these objects? How does one differentiate pages of different MIME types (such as HTML, XHTML, and XML? How do JavaScript scripts access these HTML elements? How does CSS attributes affect the painting of each element? With these problems, hacking the WebKit engine. After gtklauncher is started, the first WebCore object created is The WebCore: Page object, which is not equivalent to a loaded web page, this object can be viewed as a browsing session. WebCore: page contains chrome objects (for example, JS can use this object to bring up a prompt box in the browser), browser settings, rendertheme object, history object, and frame object. These objects are created only once during a browsing session. That is to say, no matter how many page jumps occur in a session, the objects will not be destroyed, these objects are destroyed only when the browser exits. The frame object is related to page loading and display. It mainly manages the loading of resources (the responsibility of frameloader) and content presentation (the responsibility of frameview ). The frame object stores two important objects: Document (description DOM tree) and domwindow. Domwindow can be seen as a window displayed on the page, and the object can be accessed through jsdomwindow in JavaScript. Because the reference of the frame created in domwindow is saved, jsdomwindow can find the Document Object of the current frame through this object. The document object is the root node of the DOM tree. All child nodes can be traversed from it. In addition, when a user clicks a connection on the page, or when the mouse slides over an element with a focus response function, the first person in the Document Object receives the event, and then uses the bubble Algorithm Find the target object and respond, and then call the processing function of the parent element in reverse direction from the target object. Nine major document objects are defined in WebCore to process different document types. For example, text/hml files are described by htmldocument objects, and image/SVG + XML files are described by svgdocument objects, "Application/XHTML + XML" is described by document. Document Object. Different document objects are created based on the received mime-type data, and their respective document objects create their document Resolvers. Here we take the text/html document as an example to describe its relationship. When a user accesses a specified URL, frameloader calls documentloader to load resources (network or local). When the page is loaded for the first time, frameloader is notified and Its begin method is called. This method creates different document Objects Based on the MIME type of the received data. htmldocument objects are created here. The htmldocument object creates an htmlparser to continue the parsing of the following documents. When frameloader receives page data again, the adddata method of the object is called. This method accesses the parser object of the document and parses the obtained data through parser. When htmlparser encounters an element tag, it will use htmlelementfactory to create the HTML * element of the response to describe the element. By reading the source code, we can know that all HTML * elements are inherited from htmlelement, while htmlelement does not directly inherit from node objects. On the contrary, it is a subclass of the styledelement class, therefore, cssparser can directly access and set attributes of HTML * elements when parsing CSS elements. Styleedelement is an inheritance and element class. We know that all element elements are subclasses of eventtarget, so HTML * elements can receive DOM events. Main object relationship diagram during WebKit running