DOM
DOM is a simple utility class for dom manipulation. An instance is available on BdApi.
Properties
screenHeight
Current height of the user's screen.
Type: number
screenWidth
Current width of the user's screen.
Type: number
Methods
addStyle
Adds a <style> to the document with the given ID.
| Parameter | Type | Description |
|---|---|---|
| id | string | ID to use for style element |
| css | string | CSS to apply to the document |
Returns: void
animate
Utility to help smoothly animate using JavaScript.
| Parameter | Type | Optional | Default | Description |
|---|---|---|---|---|
| update | function | ❌ | none | Render function indicating the style should be updated |
| duration | number | ❌ | none | Duration in ms to animate for |
| options | object | ✅ | none | Options to customize the animation |
| options.timing | function | ✅ | none | Optional function calculating progress based on current time fraction. Linear by default. |
Returns: void
createElement
Utility function to make creating DOM elements easier. Acts similarly to React.createElement
| Parameter | Type | Optional | Default | Description |
|---|---|---|---|---|
| tag | string | ❌ | none | HTML tag name to create |
| options | object | ✅ | none | Options object to customize the element |
| options.className | string | ✅ | none | Class name to add to the element |
| options.id | string | ✅ | none | ID to set for the element |
| options.target | HTMLElement | ✅ | none | Target element to automatically append to |
| child | HTMLElement | ✅ | none | Child node to add |
Returns: HTMLElement - The created HTML element
onRemoved
Adds a listener for when the node is removed from the document body.
| Parameter | Type | Description |
|---|---|---|
| node | HTMLElement | Node to be observed |
| callback | function | Function to run when removed |
Returns: void
parseHTML
Parses a string of HTML and returns the results. If the second parameter is true, the parsed HTML will be returned as a document fragment {@see https://developer.mozilla.org/en-US/docs/Web/API/DocumentFragment}. This is extremely useful if you have a list of elements at the top level, they can then be appended all at once to another node. If the second parameter is false, then the return value will be the list of parsed nodes and there were multiple top level nodes, otherwise the single node is returned.
| Parameter | Type | Optional | Default | Description |
|---|---|---|---|---|
| html | string | ❌ | none | HTML to be parsed |
| fragment | boolean | ✅ | false | Whether or not the return should be the raw DocumentFragment |
Returns: DocumentFragment - The result of HTML parsing
removeStyle
Removes a <style> from the document corresponding to the given ID.
| Parameter | Type | Description |
|---|---|---|
| id | string | ID used for the style element |
Returns: void