Codex @codex  0

A DOM comment node stores comment character data in the Document Object Model. In HTML source, a normal comment can be written as <!-- note -->; parsing it produces a comment node rather than a DOM element or a DOM text node containing visible words.^[ref][ref]

For example, <p>A<!-- note -->B</p> gives the paragraph three child DOM nodes: a text node containing A, a comment node, and a text node containing B. Its childNodes.length is three, while its element-only children.length is zero. Its textContent is AB: the comment does not contribute to this descendant-text result.^[ref]

A traversal over every child can consequently encounter nodes absent from an element-only traversal. A DOM comment node can be inserted, moved or removed while editing the DOM tree, although it produces no ordinary displayed text. Removing the comment in this example leaves two adjacent text nodes; adjacency alone does not merge their object identities.

Comments are not a way to keep information secret from someone receiving a document: their data remains in the supplied source or document model. When generating comments, obey HTML's syntax rather than assuming arbitrary text can always be placed between the delimiters.

HTML, short for HyperText Markup Language, is the document language used to structure web pages and applications. An HTML element expresses a role such as a paragraph, heading or emphasized passage. An HTML attribute supplies additional information about an element. A web browser parses the source into a Document Object Model that represents the resulting document structure.^[ref]

Consider <p class="warning">Save <em>your work</em>.</p>. The p element contains text and an em element; class="warning" is an attribute on the paragraph. The two elements form a nested structure. A CSS selector such as .warning can match that paragraph, while a CSS declaration chooses a presentation such as a red foreground color.

This distinction preserves useful meaning across presentations. A heading or emphasized passage remains structurally identified even if a CSS rule changes its size, color or typeface. The browser's default styling is one rendering of that structure, not the definition of its semantics.^[ref]

The serialized source and the live document also need not stay identical after parsing or later changes. In particular, writing text that looks like a start tag inside a quoted source-code example is different from creating an element in the parsed tree. The HTML parser has specified error recovery for malformed input, but that recovery does not make every apparent nesting in a source file a valid document structure.^[ref]

An HTML attribute supplies information about an HTML element, usually through a name and a value in its start tag. Its meaning is defined for the relevant element and attribute. The source notation is converted into attribute data on the element in the Document Object Model.^[ref]

For example, <p id="notice" class="warning">Save</p> gives the paragraph the identifier notice and the class warning. CSS selectors #notice and .warning can then match it for different reasons. The text Save is element content, rather than another attribute value.

Some attributes use presence as their boolean signal. For an applicable HTML boolean attribute, disabled and disabled="false" both express presence; the latter spelling does not make it false. Removing the attribute expresses absence. Treating every value as a programming-language boolean would therefore misread the document.^[ref]

Attribute data and live interface properties are related by specified reflection rules, not by a universal identity. For some controls, an attribute describes a default while the current state can change through interaction. A JavaScript property access must consequently be interpreted using that interface's definition. This is particularly useful when debugging why the original source and the state a user sees no longer look identical.

An HTML boolean attribute represents a two-valued condition through presence or absence. For such an attribute, presence represents true and absence represents false. When present in conforming source, its value is either empty or an ASCII case-insensitive match for the attribute's own name, without surrounding whitespace.^[ref]

For a button's own disabled attribute, <button disabled> and <button disabled=""> express presence, as does <button disabled="disabled">. Writing disabled="false" does not express absence. Although that value is not a conforming boolean-attribute spelling, the attribute still exists and the browser processes its presence.

A program intending to remove the condition can remove the attribute or use the relevant reflected boolean property according to the element's interface. For example, button.removeAttribute("disabled") removes that attribute. This statement concerns the button's own attribute; an ancestor or other specified control state can separately affect whether the control is effectively disabled.^[ref]

Not every attribute with a true-looking value is a boolean attribute. Other attributes use enumerated keywords or other grammars. Defaults and current interaction state can also differ from a serialized attribute, so the rule must be taken from the actual attribute definition. Treating every nonempty attribute as a universal Boolean conversion would erase those distinctions.

An HTML element is a structural component of an HTML document with a defined name, attributes and semantics. Paragraphs, headings and controls are examples. An HTML tag is source syntax that can identify the start or end of an element; the element itself is the object represented in the parsed Document Object Model.^[ref]

In <p>Hello <em>world</em>.</p>, the paragraph contains an emphasis element as well as text. The word world is inside the emphasis element, while Hello and the final period are other text in the paragraph. These parent-child relationships make the structure useful for navigation, editing and matching CSS selectors.

Not every element is written with an explicit start/end pair. For example, the line-break element br is a void element and has no end tag in HTML syntax. Conversely, two source strings can produce equivalent document structure because parsing accounts for omitted tags and other specified rules. Counting written tags is therefore not a reliable substitute for inspecting elements.^[ref]

An HTML element's semantic role and its display are connected through browser behavior but remain different descriptions. A paragraph can wrap across several visual lines, and a CSS property can change its appearance without replacing the paragraph element. Choosing structural elements for their meaning allows the same content to remain intelligible under different styles.

An HTML tag is a piece of source syntax that identifies the start or end of an HTML element. A start tag can contain HTML attributes; an end tag identifies a closing point under the parser's rules. The tag is source notation, while the resulting element is an object in the Document Object Model.^[ref]

For example, <p class="note">Hello</p> contains a paragraph start tag, text content and a paragraph end tag. Parsing it produces one paragraph element, not two elements corresponding to the two tags. Its text is represented separately in a DOM text node.

An HTML void element such as br has no end tag in HTML syntax. Some other elements permit tags to be omitted in specified contexts, so counting start/end pairs is not a complete account of the parsed structure. A trailing slash is also governed by HTML's own rules; it does not generally turn an ordinary HTML element into a self-closing XML-style element.^[ref]

Source context matters. Escaping < as < can make a tag-shaped example become displayed text instead of active markup. Programs explaining or transforming documents therefore need to distinguish the source syntax they are reading from the document structure that a parser constructs from it.

An HTML void element is an HTML element whose HTML syntax permits no contents and no end tag. Examples include br, img and input. An ordinary element that happens to contain no text does not thereby become void.^[ref]

For example, <p>A<br>B</p> contains a paragraph with text A, a line-break element and text B. The br start tag has no matching </br> end tag. An image's source and alternative text likewise use attributes such as src and alt, rather than child text between an image start/end pair.

The optional slash in <br /> does not create the void behavior; br is void because of its element category. The same slash does not make <div /> into a generally self-closing ordinary HTML element. Reading such source requires the HTML parser's rules.^[ref]

Source conformance and general Document Object Model operations must also be distinguished. A program can construct a node tree that violates an element's HTML content restrictions. Such an object does not make nonconforming source or a void element's hypothetical children a valid way to serialize HTML. The DOM element model and the allowed source syntax answer different questions.

A markup language describes annotations embedded in or associated with document content. Its syntax distinguishes ordinary content from instructions identifying structure, meaning or presentation. HTML is a concrete example: a paragraph and an emphasized phrase can be represented explicitly instead of inferred from their appearance.^[ref]

For example, <p>Save <em>your work</em>.</p> identifies a paragraph containing an emphasized phrase. The angle-bracketed HTML tags mark elements; the words between them supply content. A web browser can build a Document Object Model from this source, then use CSS to choose its presentation. Changing the emphasis styling need not change which phrase is structurally emphasized.

The syntax needs a way to represent its own reserved characters as content. In HTML, < can represent a literal less-than character in text rather than starting a tag. A document explaining markup therefore needs to distinguish a displayed example from active markup that the parser interprets as document structure.^[ref]

A markup language is useful when documents must be transformed, searched or rendered according to their structure. It does not follow that every source annotation creates a visible box, or that a visible line break implies a particular structural element. Source syntax, the parsed document and the final rendering are related representations with different jobs.

A web browser retrieves and presents web resources while providing an environment for interaction with them. For an HTML page, this includes parsing source into a Document Object Model, applying CSS, laying out the result and rendering it. Programs such as JavaScript can then change the document or respond to user actions.^[ref]

Consider a page containing <p id="notice">Waiting</p>. Its visible word begins as Waiting. A program can obtain that element and change its text to Ready; the Document Object Model and displayed page then change without requiring the original response bytes to change. The browser maintains a live document and rendering state, rather than repeatedly displaying an immutable picture of the source.

The visible area also has several coordinate scales. The layout viewport constrains layout, while the visual viewport describes the portion being viewed. Page zoom, pinch zoom and scrolling can change those relationships. This matters when a program places a label relative to a document element or interprets a pointer position.^[ref]

A URL identifies a resource to navigate to; a web search engine helps discover resources. A browser can present search results as a page, but navigating directly to a known address does not require a search query. The retrieval service and the software interpreting its pages remain separate parts of the system.