Manage HTML Dom with vanilla Javascipt

https://htmldom.dev/

Manage HTML DOM with vanilla JavaScript

Star me on GitHub ● 5008★

Basic

Select the children of an element

Scroll to an element

Select an element or list of elements

Scroll to top of the page

Select the text of a textarea automatically

Serialize form data into a query string

Set CSS style for an element

Select the text content of an element

Show or hide an element

Strip HTML from a given text

Submit a form with Ajax

Toggle an element

Trigger an event

Swap two nodes

Unwrap an element

Upload files with Ajax

Wrap an element around a given element

Toggle password visibility

Add or remove class from an element

Append to an element

Attach or detach an event handler

Calculate the mouse position relative to an element

Check an element against a selector

Check if an element is in the viewport

Check if an element is a descendant of another

Check if the native date input is supported

Check if the touch events are supported

Check if the code is running in the browser

Check if an element has given class

Count the number of characters of a textarea

Create an element

Clone an element

Detect clicks outside of an element

Detect if an element is focused

Create one time event handler

Detect mobile browsers

Detect internet explorer browser

Detect the dark mode

Detect mac OS browser

Distinguish between left and right mouse clicks

Determine the height and width of an element

Execute code when the document is ready

Get CSS styles of an element

Get or set the document title

Get siblings of an element

Get, set and remove attributes

Get, set and remove data attributes

Get the closest element by given selector

Get or set the HTML of an element

Get size of the selected file

Get the position of an element relative to the document

Get the document height and width

Get the text content of an element

Get the position of an element relative to another

Get the size of an image

Get the selected text

Go back to the previous page

Get the parent node of an element

Insert an element after or before other element

Loop over a nodelist

Insert given HTML after or before an element

Prevent body from scrolling when opening a modal

Prepend to an element

Press Shift and Enter for a new line

Prevent the default action of an event

Prevent the page from scrolling to an element when it is focused

Redirect to another page

Put cursor at the end of an input

Remove all children of a node

Reload the current page

Replace broken images

Remove an element

Replace an element

Resize an iframe to fit its content

Intermediate

Resize the width of a text box to fit its content automatically

Scale a text to fit inside of an element

Scroll an element to ensure it is visible in a scrollable container

Save and restore the text selection

Show a loading indicator when an iframe is being loaded

Show a custom context menu at clicked position

Show a ghost element when dragging an element

Allow to enter particular characters only

Calculate the size of scrollbar

Change the website favicon

Check if an element is visible in a scrollable container

Check if an element is scrollable

Copy text to the clipboard

Communication between an iframe and its parent window

Detect if the caps lock is on

Download a file

Export a table to csv

Get the default value of a CSS property

Get the first scrollable parent of an element

Get the direction of the text selection

Highlight an element when dragging a file over it

Load a CSS file dynamically

Load a JavaScript file dynamically

Paste an image from the clipboard

Measure the width of given text of given font

Paste as plain text

Placeholder for a contenteditable element

Position an element absolutely to another element

Preview an image before uploading it

Print an image

Resize an image

Advanced

Scroll to an element smoothly

Show or hide table columns

Sort a table by clicking its headers

Zoom an image

Copy highlighted code to the clipboard

Create a custom scrollbar

Create a range slider

Create resizable split views

Create an image comparison slider

Drag to scroll

Drag and drop element in a list

Drag and drop table row

Drag and drop table column

Make a resizable element

Make a draggable element

Resize columns of a table

Tip

Attach event handlers inside other handlers