--- tags: zeta-dom --- # DOM utilities ### `tagName` Returns the tag name of the given element in lower case. ```typescript tagName(element) ``` ###### Example ```typescript let anchor = document.createElement('A'); let result = tagName(anchor); // 'a' ``` ## Predicates ### `matchSelector` Tests whether a given element matches a CSS selector. ```typescript matchSelector(element, selector) ``` ### `isVisible` Gets whether an HTML element is visually painted. ```typescript isVisible(element) ``` ### `comparePosition` Returns whether one node precedes the other node in document order. ```typescript comparePosition(node1, node2, strict) ``` Returns -1 if the first node precedes the second; 1 if the second node precedes the first; 0 if they are the same node; or NaN if one containing the other when strict to set to true. ### `connected` Tests whether two elements is in the same node tree (i.e. document or same fragment). ```typescript connected(node1, node2) ``` ### `containsOrEquals` Tests whether the first node refers the same or contains the second node. ```typescript containsOrEquals(container, contained) ``` ## Traversals ### `combineNodeFilters` Combines multiple node filters. ```typescript combineNodeFilters(...callbacks) ``` Given one or more filter callback(s): * If any one of the filter returns 2 meaning to skip the given node and its descendants, the combined filter will also return 2 and no subsequent filters will be called. * If any one of the filter returns 3 meaning to skip the given node, the combined filter will also return 3. * Otherwise 1 is returned. ### `iterateNode` Iterates and invoke the given callback for each node. ```typescript iterateNode(iterator, callback?, from?) ``` ###### Parameters | Name | Description | | ---- | ---- | |`iterator` | Any iterable object with the previousNode and nextNode methods. |`callback`| *Optional* --- Function to be called on each node. |`from`| *Optional* --- If given, invocation of the callback will be skipped until the specified node. ### `iterateNodeToArray` Creates an array containing each node in the iterated order; *or* optionally any mapped result. ```typescript iterateNodeToArray(iterator, callback?, from?, until?) ``` ###### Parameters | Name | Description | | ---- | ---- | |`iterator` | Any iterable object with the previousNode and nextNode methods. |`callback`| *Optional* --- Function called for each original item which returns one or more items to the result array. If null or undefined is returned, it will not be included in the result array. |`from`| *Optional* --- If given, invocation of the callback will be skipped until the specified node. |`until` |*Optional* --- If given, iteration will be stopped once the specified node is iterated, callback will not be fired for this node. ### `getCommonAncestor` ### `parentsAndSelf` ### `selectIncludeSelf` ### `selectClosestRelative` ## Events ### `bind` ### `bindUntil` ### `dispatchDOMMouseEvent` ## Manipulation ### `removeNode` ### `getClass` ### `setClass` ## domUtil (scrolling) ### `getScrollOffset` ### `getScrollParent` ### `getContentRect` ### `scrollBy` ### `scrollIntoView` Try to scroll an element into view. An object containing Number of pixels in x and y direction actually scrolled; or `false` if scrolling did not happened, either because the element or the region is already in view, or parent elements cannot be further scrolled. ```typescript scrollIntoView(elm) scrollIntoView(elm, rect) scrollIntoView(elm, margin) ``` ###### Parameters | Name | Description | | -------- | ----------------------------------------------------------------------- | | `elm` | Element to be scrolled into view. | | `rect` | *Optional* --- A rect represent a region inside the element to be scrolled into view. | | `margin` | *Optional* --- Number of pixels away from the edge where element should be positioned. | ## domUtil (rect and position) ### `getRect` ### `getRects` ### `toPlainRect` ### `rectEquals` ### `rectCovers` ### `rectIntersects` ### `pointInRect` ### `mergeRect` ### `elementFromPoint` ### `makeSelection`