or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

arrays.mdassertions.mdcore.mddom.mdevents.mdindex.mdmath.mdobjects.mdstrings.md
tile.json

dom.mddocs/

DOM Manipulation

Powerful DOM manipulation utilities for element access, creation, content management, and tree traversal with comprehensive cross-browser compatibility.

Capabilities

Element Access

Functions for finding and accessing DOM elements.

/**
 * Gets element by ID or returns element if already an element
 * @param {string|Element} element - ID string or element
 * @return {Element} Found element or null
 */
goog.dom.getElement = function(element) {};

/**
 * Alias for getElementById - gets element by ID
 * @param {string} id - Element ID
 * @return {Element} Found element or null
 */
goog.dom.$ = function(id) {};

/**
 * Gets first element with specified class name
 * @param {string} className - Class name to search for
 * @param {Element|Document=} opt_el - Root element to search within
 * @return {Element} First matching element or null
 */
goog.dom.getElementByClass = function(className, opt_el) {};

/**
 * Gets all elements with specified class name
 * @param {string} className - Class name to search for
 * @param {Element|Document=} opt_el - Root element to search within
 * @return {Array<Element>} Array of matching elements
 */
goog.dom.getElementsByClass = function(className, opt_el) {};

/**
 * Gets elements by tag name
 * @param {string} tagName - Tag name to search for
 * @param {Element|Document=} opt_el - Root element to search within
 * @return {NodeList} NodeList of matching elements
 */
goog.dom.getElementsByTagName = function(tagName, opt_el) {};

/**
 * Gets first element by tag name and class name
 * @param {string} tagName - Tag name
 * @param {string} className - Class name
 * @param {Element|Document=} opt_el - Root element to search within
 * @return {Element} First matching element or null
 */
goog.dom.getElementByTagNameAndClass = function(tagName, className, opt_el) {};

/**
 * Gets elements by tag name and class name
 * @param {string} tagName - Tag name
 * @param {string} className - Class name
 * @param {Element|Document=} opt_el - Root element to search within
 * @return {Array<Element>} Array of matching elements
 */
goog.dom.getElementsByTagNameAndClass = function(tagName, className, opt_el) {};

/**
 * Gets DOM helper for an element's document
 * @param {Element=} opt_element - Element to get helper for
 * @return {goog.dom.DomHelper} DOM helper instance
 */
goog.dom.getDomHelper = function(opt_element) {};

/**
 * Gets element by ID with assertion (throws if not found)
 * @param {string} id - Element ID
 * @return {!Element} Element (guaranteed to exist)
 * @throws {Error} If element not found
 */
goog.dom.getRequiredElement = function(id) {};

/**
 * Gets first element by class name with assertion
 * @param {string} className - Class name to search for
 * @param {Element=} opt_root - Root element to search within
 * @return {!Element} First element with the class (guaranteed to exist)
 * @throws {Error} If element not found
 */
goog.dom.getRequiredElementByClass = function(className, opt_root) {};

/**
 * Gets HTML element by ID
 * @param {string} id - Element ID
 * @return {HTMLElement} HTML element or null if not found
 */
goog.dom.getHTMLElement = function(id) {};

/**
 * Gets HTML element by ID with assertion
 * @param {string} id - Element ID
 * @return {!HTMLElement} HTML element (guaranteed to exist)
 * @throws {Error} If element not found
 */
goog.dom.getRequiredHTMLElement = function(id) {};

/**
 * Gets first HTML element by class name
 * @param {string} className - Class name to search for
 * @param {Element=} opt_parent - Parent element to search within
 * @return {HTMLElement} First HTML element with the class or null
 */
goog.dom.getHTMLElementByClass = function(className, opt_parent) {};

/**
 * Gets first HTML element by class name with assertion
 * @param {string} className - Class name to search for
 * @param {Element=} opt_parent - Parent element to search within
 * @return {!HTMLElement} First HTML element with the class (guaranteed to exist)
 * @throws {Error} If element not found
 */
goog.dom.getRequiredHTMLElementByClass = function(className, opt_parent) {};

Element Creation

Functions for creating new DOM elements and nodes.

/**
 * Creates a new element
 * @param {string} tagName - Tag name for the element
 * @return {Element} Created element
 */
goog.dom.createElement = function(tagName) {};

/**
 * Creates element with attributes and content
 * @param {string} tagName - Tag name for the element
 * @param {Object|string=} opt_attributes - Attributes object or class name
 * @param {...(string|Node)} var_args - Text content or child nodes
 * @return {Element} Created element with content
 */
goog.dom.createDom = function(tagName, opt_attributes, var_args) {};

/**
 * Creates a table element
 * @param {number} rows - Number of rows
 * @param {number} columns - Number of columns
 * @param {boolean=} opt_fillWithNbsp - Whether to fill cells with &nbsp;
 * @return {Element} Created table element
 */
goog.dom.createTable = function(rows, columns, opt_fillWithNbsp) {};

/**
 * Creates a text node
 * @param {string} content - Text content
 * @return {Text} Created text node
 */
goog.dom.createTextNode = function(content) {};

/**
 * Converts HTML string to document fragment
 * @param {string} htmlString - HTML string to convert
 * @return {DocumentFragment} Document fragment
 */
goog.dom.htmlToDocumentFragment = function(htmlString) {};

/**
 * Converts SafeHtml to DOM node
 * @param {goog.html.SafeHtml} html - SafeHtml to convert
 * @return {Node} Created DOM node
 */
goog.dom.safeHtmlToNode = function(html) {};

Content Manipulation

Functions for modifying element content and structure.

/**
 * Appends child node to parent
 * @param {Node} parent - Parent node
 * @param {Node} child - Child node to append
 */
goog.dom.appendChild = function(parent, child) {};

/**
 * Appends multiple children to parent
 * @param {Node} parent - Parent node
 * @param {...Node} var_args - Child nodes to append
 */
goog.dom.append = function(parent, var_args) {};

/**
 * Removes all child nodes from element
 * @param {Node} node - Node to remove children from
 */
goog.dom.removeChildren = function(node) {};

/**
 * Inserts node before reference node
 * @param {Node} newNode - Node to insert
 * @param {Node} refNode - Reference node
 */
goog.dom.insertSiblingBefore = function(newNode, refNode) {};

/**
 * Inserts node after reference node
 * @param {Node} newNode - Node to insert
 * @param {Node} refNode - Reference node
 */
goog.dom.insertSiblingAfter = function(newNode, refNode) {};

/**
 * Inserts child at specific index
 * @param {Node} parent - Parent node
 * @param {Node} child - Child node to insert
 * @param {number} index - Index to insert at
 */
goog.dom.insertChildAt = function(parent, child, index) {};

/**
 * Removes node from DOM
 * @param {Node} node - Node to remove
 * @return {Node} Removed node
 */
goog.dom.removeNode = function(node) {};

/**
 * Replaces old node with new node
 * @param {Node} newNode - New node
 * @param {Node} oldNode - Old node to replace
 */
goog.dom.replaceNode = function(newNode, oldNode) {};

Element Properties

Functions for getting and setting element properties and content.

/**
 * Gets text content of a node
 * @param {Node} node - Node to get text from
 * @return {string} Text content
 */
goog.dom.getTextContent = function(node) {};

/**
 * Sets text content of a node
 * @param {Node} node - Node to set text on
 * @param {string} text - Text to set
 */
goog.dom.setTextContent = function(node, text) {};

/**
 * Gets the node name (tag name for elements)
 * @param {Node} node - Node to get name from
 * @return {string} Node name
 */
goog.dom.getNodeName = function(node) {};

/**
 * Gets the node type
 * @param {Node} node - Node to get type from
 * @return {number} Node type constant
 */
goog.dom.getNodeType = function(node) {};

/**
 * Tests if object is a DOM element
 * @param {*} obj - Object to test
 * @return {boolean} True if object is element
 */
goog.dom.isElement = function(obj) {};

/**
 * Tests if node is a text node
 * @param {Node} node - Node to test
 * @return {boolean} True if text node
 */
goog.dom.isText = function(node) {};

/**
 * Tests if node can have children
 * @param {Node} node - Node to test
 * @return {boolean} True if can have children
 */
goog.dom.canHaveChildren = function(node) {};

/**
 * Tests if node has child nodes
 * @param {Node} node - Node to test
 * @return {boolean} True if has children
 */
goog.dom.hasChildren = function(node) {};

/**
 * Sets multiple properties on an element
 * @param {Element} element - Element to set properties on
 * @param {Object} properties - Properties object
 */
goog.dom.setProperties = function(element, properties) {};

Tree Traversal

Functions for navigating the DOM tree structure.

/**
 * Gets child elements (not text nodes)
 * @param {Element} element - Parent element
 * @return {Array<Element>} Array of child elements
 */
goog.dom.getChildren = function(element) {};

/**
 * Gets first element child
 * @param {Node} node - Parent node
 * @return {Element} First element child or null
 */
goog.dom.getFirstElementChild = function(node) {};

/**
 * Gets last element child
 * @param {Node} node - Parent node
 * @return {Element} Last element child or null
 */
goog.dom.getLastElementChild = function(node) {};

/**
 * Gets next element sibling
 * @param {Node} node - Node to get sibling for
 * @return {Element} Next element sibling or null
 */
goog.dom.getNextElementSibling = function(node) {};

/**
 * Gets previous element sibling
 * @param {Node} node - Node to get sibling for
 * @return {Element} Previous element sibling or null
 */
goog.dom.getPreviousElementSibling = function(node) {};

/**
 * Gets next node in tree traversal (simplified signature)
 * @param {Node} node - Current node
 * @return {Node} Next node or null
 */
goog.dom.getNextNode = function(node) {};

/**
 * Gets previous node in tree traversal (simplified signature)
 * @param {Node} node - Current node
 * @return {Node} Previous node or null
 */
goog.dom.getPreviousNode = function(node) {};

/**
 * Finds ancestor by tag name and class
 * @param {Element} element - Starting element
 * @param {string=} opt_tag - Tag name to match
 * @param {string=} opt_class - Class name to match
 * @param {number=} opt_maxSearchSteps - Maximum steps to search
 * @return {Element} Matching ancestor or null
 */
goog.dom.getAncestorByTagNameAndClass = function(element, opt_tag, opt_class, opt_maxSearchSteps) {};

/**
 * Finds ancestor by class name
 * @param {Element} element - Starting element
 * @param {string} className - Class name to match
 * @param {number=} opt_maxSearchSteps - Maximum steps to search
 * @return {Element} Matching ancestor or null
 */
goog.dom.getAncestorByClass = function(element, className, opt_maxSearchSteps) {};

/**
 * Finds ancestor matching function
 * @param {Element} element - Starting element
 * @param {function(Element): boolean} matcher - Matching function
 * @param {boolean=} opt_includeNode - Whether to include starting element
 * @param {number=} opt_maxSearchSteps - Maximum steps to search
 * @return {Element} Matching ancestor or null
 */
goog.dom.getAncestor = function(element, matcher, opt_includeNode, opt_maxSearchSteps) {};

Document Utilities

Functions for working with documents and windows.

/**
 * Gets the owner document for a node
 * @param {Node} node - Node to get document for
 * @return {Document} Owner document
 */
goog.dom.getOwnerDocument = function(node) {};

/**
 * Gets document from frame element
 * @param {Element} frame - Frame element
 * @return {Document} Frame's document
 */
goog.dom.getFrameContentDocument = function(frame) {};

/**
 * Gets window from frame element
 * @param {Element} frame - Frame element
 * @return {Window} Frame's window
 */
goog.dom.getFrameContentWindow = function(frame) {};

/**
 * Sets tab index to make element focusable
 * @param {Element} element - Element to modify
 * @param {boolean} enable - Whether to enable focusing
 */
goog.dom.setFocusableTabIndex = function(element, enable) {};

/**
 * Tests if element has focusable tab index
 * @param {Element} element - Element to test
 * @return {boolean} True if focusable
 */
goog.dom.isFocusableTabIndex = function(element) {};

/**
 * Gets the current document
 * @return {!Document} Current document
 */
goog.dom.getDocument = function() {};

/**
 * Gets window associated with document
 * @param {Document=} opt_doc - Document (defaults to current document)
 * @return {!Window} Associated window
 */
goog.dom.getWindow = function(opt_doc) {};

/**
 * Gets viewport dimensions
 * @param {Window=} opt_window - Window (defaults to current window)
 * @return {!Size} Viewport size
 */
goog.dom.getViewportSize = function(opt_window) {};

/**
 * Gets document height
 * @return {number} Document height in pixels
 */
goog.dom.getDocumentHeight = function() {};

/**
 * Gets document scroll position
 * @return {!Coordinate} Scroll position (x, y)
 */
goog.dom.getDocumentScroll = function() {};

/**
 * Tests if node is in document
 * @param {Node} node - Node to test
 * @return {boolean} True if node is in document
 */
goog.dom.isInDocument = function(node) {};

/**
 * Tests if element can receive focus
 * @param {!Element} element - Element to test
 * @return {boolean} True if element is focusable
 */
goog.dom.isFocusable = function(element) {};

/**
 * Gets currently active element in document
 * @param {Document} doc - Document to get active element from
 * @return {Element} Active element or null
 */
goog.dom.getActiveElement = function(doc) {};

/**
 * Tests node containment relationship
 * @param {Node} parent - Potential parent node
 * @param {Node} descendant - Potential descendant node
 * @return {boolean} True if parent contains descendant
 */
goog.dom.contains = function(parent, descendant) {};

/**
 * Gets pixel ratio for high-DPI displays
 * @return {number} Device pixel ratio
 */
goog.dom.getPixelRatio = function() {};

Usage Examples:

// Element access
var element = goog.dom.getElement('myDiv');
var buttons = goog.dom.getElementsByClass('button');

// Element creation
var newDiv = goog.dom.createDom('div', {'class': 'container'}, 'Hello World');
var textNode = goog.dom.createTextNode('Some text');

// Content manipulation
goog.dom.appendChild(document.body, newDiv);
goog.dom.setTextContent(element, 'New content');
goog.dom.removeChildren(element);

// Tree traversal
var children = goog.dom.getChildren(element);
var nextSibling = goog.dom.getNextElementSibling(element);
var ancestor = goog.dom.getAncestorByClass(element, 'parent-class');