fQuery is a free, open-source DOM manipulation library for JavaScript.
It is a lightweight (~16kb gzipped) and modern library, utilizing ES6 syntax and features including Promises.
- Installation
- Basic Usage
- Ajax
- Animation
- Attributes
- Cookie
- Events
- Manipulation
- Parsing
- Queue
- Scripts
- Stylesheets
- Traversal
- Utility
In Browser
<script type="text/javascript" src="/path/to/fquery.min.js"></script>Using NPM
npm i @fr0st/query In Node.js:
import { JSDOM } from 'jsdom'; import registerGlobals from '@fr0st/query'; const window = new JSDOM(''); const $ = registerGlobals(window);selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet, an array of nodes or a function to execute when the DOM is ready.contextis a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, HTMLCollection, QuerySet or an array of nodes, and will default to the Document context of thedom.
const query = $(selector, context);This method returns a QuerySet.
Query One
You can also query for a single node using the queryOne method.
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet, or an array of nodes.contextis a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, HTMLCollection, QuerySet or an array of nodes, and will default to the Document context of thedom.
const query = $.queryOne(selector, context);This method returns a QuerySet.
No Conflict
Reset the global $ variable.
$.noConflict();You can continue to use this library by using the global fQuery variable.
This library also includes all functions from the FrostCore library, accessible from the $ global variable (with an underscore prefix).
const random = $._random();Ajax
Perform an XHR request.
optionsis an object containing options for the request.urlis a string containing the URL for the request, and will default to the current window location.methodis a string containing the method to use for the request, and will default to "GET".datacan be an object, array, string or FormData containing data to send with the request, and will default to null.contentTypeis a string containing the Content-Type header to send with the request, and will default to "application/x-www-form-urlencoded".responseTypeis a string containing the expected Content-Type header of the response.mimeTypeis a string containing the MIME type to use for the server response.usernameis a string containing the username to authenticate with.passwordis a string containing the password to authenticate with.timeoutis a number indicating the number of milliseconds before the request will be terminated, and will default to 0.isLocalis a boolean indicating whether the request will be treated as local.cacheis a boolean indicating whether to cache the request, and will default to true.processDatais a boolean indicating whether to process the data depending on thecontentType, and will default to true.rejectOnCancelis a boolean indicating whether to reject the promise if the request is cancelled, and will default to true.headersis an object containing additional headers to send with the request.afterSendis a function that accepts anxhrargument, and will be called after the request is sent.beforeSendis a function that accepts anxhrargument, and will be called before the request is sent.onProgressis a function that acceptsprogress,xhrandeventas arguments and will be called on XHR download progress.onUploadProgressis a function that acceptsprogress,xhrandeventas arguments and will be called on XHR upload progress.
This method returns an AjaxRequest that resolves when the request is completed, or rejects on failure.
const request = $.ajax(options);Delete
Perform an XHR DELETE request.
urlis a string containing the URL for the request.optionsis an object containing options for the request.methodis a string containing the method to use for the request, and will default to "DELETE".contentTypeis a string containing the Content-Type header to send with the request, and will default to "application/x-www-form-urlencoded".responseTypeis a string containing the expected Content-Type header of the response.mimeTypeis a string containing the MIME type to use for the server response.usernameis a string containing the username to authenticate with.passwordis a string containing the password to authenticate with.timeoutis a number indicating the number of milliseconds before the request will be terminated, and will default to 0.isLocalis a boolean indicating whether the request will be treated as local.cacheis a boolean indicating whether to cache the request, and will default to true.processDatais a boolean indicating whether to process the data depending on thecontentType, and will default to true.rejectOnCancelis a boolean indicating whether to reject the promise if the request is cancelled, and will default to true.headersis an object containing additional headers to send with the request.afterSendis a function that accepts anxhrargument, and will be called after the request is sent.beforeSendis a function that accepts anxhrargument, and will be called before the request is sent.onProgressis a function that acceptsprogress,xhrandeventas arguments and will be called on XHR download progress.onUploadProgressis a function that acceptsprogress,xhrandeventas arguments and will be called on XHR upload progress.
This method returns an AjaxRequest that resolves when the request is completed, or rejects on failure.
const request = $.delete(url, options);Get
Perform an XHR GET request.
urlis a string containing the URL for the request.datacan be an object, array, string containing data to send with the request, and will default to null.optionsis an object containing options for the request.methodis a string containing the method to use for the request, and will default to "GET".contentTypeis a string containing the Content-Type header to send with the request, and will default to "application/x-www-form-urlencoded".responseTypeis a string containing the expected Content-Type header of the response.mimeTypeis a string containing the MIME type to use for the server response.usernameis a string containing the username to authenticate with.passwordis a string containing the password to authenticate with.timeoutis a number indicating the number of milliseconds before the request will be terminated, and will default to 0.isLocalis a boolean indicating whether the request will be treated as local.cacheis a boolean indicating whether to cache the request, and will default to true.processDatais a boolean indicating whether to process the data depending on thecontentType, and will default to true.rejectOnCancelis a boolean indicating whether to reject the promise if the request is cancelled, and will default to true.headersis an object containing additional headers to send with the request.afterSendis a function that accepts anxhrargument, and will be called after the request is sent.beforeSendis a function that accepts anxhrargument, and will be called before the request is sent.onProgressis a function that acceptsprogress,xhrandeventas arguments and will be called on XHR download progress.onUploadProgressis a function that acceptsprogress,xhrandeventas arguments and will be called on XHR upload progress.
This method returns an AjaxRequest that resolves when the request is completed, or rejects on failure.
const request = $.get(url, data, options);Patch
Perform an XHR PATCH request.
urlis a string containing the URL for the request.datacan be an object, array, string or FormData containing data to send with the request, and will default to null.optionsis an object containing options for the request.methodis a string containing the method to use for the request, and will default to "PATCH".contentTypeis a string containing the Content-Type header to send with the request, and will default to "application/x-www-form-urlencoded".responseTypeis a string containing the expected Content-Type header of the response.mimeTypeis a string containing the MIME type to use for the server response.usernameis a string containing the username to authenticate with.passwordis a string containing the password to authenticate with.timeoutis a number indicating the number of milliseconds before the request will be terminated, and will default to 0.isLocalis a boolean indicating whether the request will be treated as local.cacheis a boolean indicating whether to cache the request, and will default to true.processDatais a boolean indicating whether to process the data depending on thecontentType, and will default to true.rejectOnCancelis a boolean indicating whether to reject the promise if the request is cancelled, and will default to true.headersis an object containing additional headers to send with the request.afterSendis a function that accepts anxhrargument, and will be called after the request is sent.beforeSendis a function that accepts anxhrargument, and will be called before the request is sent.onProgressis a function that acceptsprogress,xhrandeventas arguments and will be called on XHR download progress.onUploadProgressis a function that acceptsprogress,xhrandeventas arguments and will be called on XHR upload progress.
This method returns an AjaxRequest that resolves when the request is completed, or rejects on failure.
const request = $.patch(url, data, options);Post
Perform an XHR POST request.
urlis a string containing the URL for the request.datacan be an object, array, string or FormData containing data to send with the request, and will default to null.optionsis an object containing options for the request.methodis a string containing the method to use for the request, and will default to "POST".contentTypeis a string containing the Content-Type header to send with the request, and will default to "application/x-www-form-urlencoded".responseTypeis a string containing the expected Content-Type header of the response.mimeTypeis a string containing the MIME type to use for the server response.usernameis a string containing the username to authenticate with.passwordis a string containing the password to authenticate with.timeoutis a number indicating the number of milliseconds before the request will be terminated, and will default to 0.isLocalis a boolean indicating whether the request will be treated as local.cacheis a boolean indicating whether to cache the request, and will default to true.processDatais a boolean indicating whether to process the data depending on thecontentType, and will default to true.rejectOnCancelis a boolean indicating whether to reject the promise if the request is cancelled, and will default to true.headersis an object containing additional headers to send with the request.afterSendis a function that accepts anxhrargument, and will be called after the request is sent.beforeSendis a function that accepts anxhrargument, and will be called before the request is sent.onProgressis a function that acceptsprogress,xhrandeventas arguments and will be called on XHR download progress.onUploadProgressis a function that acceptsprogress,xhrandeventas arguments and will be called on XHR upload progress.
This method returns an AjaxRequest that resolves when the request is completed, or rejects on failure.
const request = $.post(url, data, options);Put
Perform an XHR PUT request.
urlis a string containing the URL for the request.datacan be an object, array, string or FormData containing data to send with the request, and will default to null.optionsis an object containing options for the request.methodis a string containing the method to use for the request, and will default to "PUT".contentTypeis a string containing the Content-Type header to send with the request, and will default to "application/x-www-form-urlencoded".responseTypeis a string containing the expected Content-Type header of the response.mimeTypeis a string containing the MIME type to use for the server response.usernameis a string containing the username to authenticate with.passwordis a string containing the password to authenticate with.timeoutis a number indicating the number of milliseconds before the request will be terminated, and will default to 0.isLocalis a boolean indicating whether the request will be treated as local.cacheis a boolean indicating whether to cache the request, and will default to true.processDatais a boolean indicating whether to process the data depending on thecontentType, and will default to true.rejectOnCancelis a boolean indicating whether to reject the promise if the request is cancelled, and will default to true.headersis an object containing additional headers to send with the request.afterSendis a function that accepts anxhrargument, and will be called after the request is sent.beforeSendis a function that accepts anxhrargument, and will be called before the request is sent.onProgressis a function that acceptsprogress,xhrandeventas arguments and will be called on XHR download progress.onUploadProgressis a function that acceptsprogress,xhrandeventas arguments and will be called on XHR upload progress.
This method returns an AjaxRequest that resolves when the request is completed, or rejects on failure.
const request = $.put(url, data, options);Animate
Add an animation to each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.callbackis a function that acceptsnode,progressandoptionsas arguments, wherenodeis a HTMLElement,progressis a value between 0 and 1 andoptionsis theoptionsobject passed to this method.optionsis an object containing options for how the animation should be handled.durationis the number of milliseconds that the animation should last, and will default to 1000.typeis a string of either ease-in, ease-out, ease-in-out or linear indicating the type of animation to run, and will default to ease-in-out.infiniteis a boolean indicating whether the animation should continue forever, and will default to false.
This method returns an AnimationSet that will resolve after the animation has completed.
const animation = $.animate(selector, callback, options);Stop Animations
Stop all animations for each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the animations should be stopped.finishis a boolean indicating whether to immediately finish the animation, and will default to true.
$.stop(selector, options);Drop In
Drop each node into place.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of node.optionsis an object containing options for how the animation should be handled.directionis a string or function that returns either "top", "right", "bottom" or "left" indicating the direction to drop from, and will default to "top".durationis the number of milliseconds that the animation should last, and will default to 1000.typeis a string of either "ease-in", "ease-out", "ease-in-out" or "linear" indicating the type of animation to run, and will default to "ease-in-out".infiniteis a boolean indicating whether the animation should continue forever, and will default to false.useGpuis a boolean indicating whether the animation should use GPU acceleration (CSS transform) and will default to true.
This method returns an AnimationSet that will resolve after the animation has completed.
const animation = $.dropIn(selector, options);Drop Out
Drop each node out of place.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the animation should be handled.directionis a string or function that returns either "top", "right", "bottom" or "left" indicating the direction to drop from, and will default to "top".durationis the number of milliseconds that the animation should last, and will default to 1000.typeis a string of either "ease-in", "ease-out", "ease-in-out" or "linear" indicating the type of animation to run, and will default to "ease-in-out".infiniteis a boolean indicating whether the animation should continue forever, and will default to false.useGpuis a boolean indicating whether the animation should use GPU acceleration (CSS transform) and will default to true.
This method returns an AnimationSet that will resolve after the animation has completed.
const animation = $.dropOut(selector, options);Fade In
Fade the opacity of each node in.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the animation should be handled.durationis the number of milliseconds that the animation should last, and will default to 1000.typeis a string of either "ease-in", "ease-out", "ease-in-out" or "linear" indicating the type of animation to run, and will default to "ease-in-out".infiniteis a boolean indicating whether the animation should continue forever, and will default to false.
This method returns an AnimationSet that will resolve after the animation has completed.
const animation = $.fadeIn(selector, options);Fade Out
Fade the opacity of each node out.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the animation should be handled.durationis the number of milliseconds that the animation should last, and will default to 1000.typeis a string of either "ease-in", "ease-out", "ease-in-out" or "linear" indicating the type of animation to run, and will default to "ease-in-out".infiniteis a boolean indicating whether the animation should continue forever, and will default to false.
This method returns an AnimationSet that will resolve after the animation has completed.
const animation = $.fadeOut(selector, options);Rotate In
Rotate each node in on an X, Y or Z.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the animation should be handled.xis the amount of rotation to apply to the X axis, and will default to 0.yis the amount of rotation to apply to the Y axis, and will default to 1.zis the amount of rotation to apply to the Z axis, and will default to 0.inverseis a boolean indicating whether to rotate in the opposite direction, and will default to false.durationis the number of milliseconds that the animation should last, and will default to 1000.typeis a string of either "ease-in", "ease-out", "ease-in-out" or "linear" indicating the type of animation to run, and will default to "ease-in-out".infiniteis a boolean indicating whether the animation should continue forever, and will default to false.
This method returns an AnimationSet that will resolve after the animation has completed.
const animation = $.rotateIn(selector, options);Rotate Out
Rotate each node out on an X, Y or Z.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the animation should be handled.xis the amount of rotation to apply to the X axis, and will default to 0.yis the amount of rotation to apply to the Y axis, and will default to 1.zis the amount of rotation to apply to the Z axis, and will default to 0.inverseis a boolean indicating whether to rotate in the opposite direction, and will default to false.durationis the number of milliseconds that the animation should last, and will default to 1000.typeis a string of either "ease-in", "ease-out", "ease-in-out" or "linear" indicating the type of animation to run, and will default to "ease-in-out".infiniteis a boolean indicating whether the animation should continue forever, and will default to false.
This method returns an AnimationSet that will resolve after the animation has completed.
const animation = $.rotateOut(selector, options);Slide In
Slide each node into place to a direction.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the animation should be handled.directionis a string or function that returns either "top", "right", "bottom" or "left" indicating the direction to slide from, and will default to "top".durationis the number of milliseconds that the animation should last, and will default to 1000.typeis a string of either "ease-in", "ease-out", "ease-in-out" or "linear" indicating the type of animation to run, and will default to "ease-in-out".infiniteis a boolean indicating whether the animation should continue forever, and will default to false.useGpuis a boolean indicating whether the animation should use GPU acceleration (CSS transform) and will default to true.
This method returns an AnimationSet that will resolve after the animation has completed.
const animation = $.slideIn(selector, options);Slide Out
Slide each node out of place from a direction.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the animation should be handled.directionis a string or function that returns either "top", "right", "bottom" or "left" indicating the direction to slide from, and will default to "top".durationis the number of milliseconds that the animation should last, and will default to 1000.typeis a string of either "ease-in", "ease-out", "ease-in-out" or "linear" indicating the type of animation to run, and will default to "ease-in-out".infiniteis a boolean indicating whether the animation should continue forever, and will default to false.useGpuis a boolean indicating whether the animation should use GPU acceleration (CSS transform) and will default to true.
This method returns an AnimationSet that will resolve after the animation has completed.
const animation = $.slideOut(selector, options);Squeeze In
Squeeze each node into place to a direction.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the animation should be handled.directionis a string or function that returns either "top", "right", "bottom" or "left" indicating the direction to squeeze from, and will default to "top".durationis the number of milliseconds that the animation should last, and will default to 1000.typeis a string of either "ease-in", "ease-out", "ease-in-out" or "linear" indicating the type of animation to run, and will default to "ease-in-out".infiniteis a boolean indicating whether the animation should continue forever, and will default to false.useGpuis a boolean indicating whether the animation should use GPU acceleration (CSS transform) and will default to true.
This method returns an AnimationSet that will resolve after the animation has completed.
const animation = $.squeezeIn(selector, options);Squeeze Out
Squeeze each node out of place from a direction.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the animation should be handled.directionis a string or function that returns either "top", "right", "bottom" or "left" indicating the direction to squeeze from, and will default to "top".durationis the number of milliseconds that the animation should last, and will default to 1000.typeis a string of either "ease-in", "ease-out", "ease-in-out" or "linear" indicating the type of animation to run, and will default to "ease-in-out".infiniteis a boolean indicating whether the animation should continue forever, and will default to false.useGpuis a boolean indicating whether the animation should use GPU acceleration (CSS transform) and will default to true.
This method returns an AnimationSet that will resolve after the animation has completed.
const animation = $.squeezeOut(selector, options);Get Attribute
Get an attribute value for the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.attributeis a string indicating the attribute value to return.
const value = $.getAttribute(selector, attribute);If the attribute argument is omitted, an object containing all attribute values will be returned instead.
const attributes = $.getAttribute(selector);Get Dataset
Get a dataset value for the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.keyis a string indicating the dataset value to return.
const value = $.getDataset(selector, key);If the key argument is omitted, an object containing all dataset values will be returned instead.
const dataset = $.getDataset(selector);This method will attempt to convert string values to JS primitives (including booleans, numbers, objects, arrays and null).
Get HTML
Get the HTML contents of the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const html = $.getHTML(selector);Get Property
Get a property value for the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.propertyis a string indicating the property value to return.
const value = $.getProperty(selector, property);Get Text
Get the text contents of the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const text = $.getText(selector);Get Value
Get the value property of the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const value = $.getValue(selector);Remove Attribute
Remove an attribute from each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.attributeis a string indicating the attribute value to remove.
$.removeAttribute(selector, attribute);Remove Dataset
Remove a dataset value from each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.keyis a string indicating the dataset value to remove.
$.removeDataset(selector, key);Remove Property
Remove a property from each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.propertyis a string indicating the property value to remove.
$.removeProperty(selector, property);Set Attribute
Set attributes for each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.attributeis a string indicating the attribute value to set.valueis the value you want to set the attribute to.
$.setAttribute(selector, attribute, value);Alternatively, you can set multiple attributes by passing a single attributes object as the argument with key/value pairs of the attributes to set.
$.setAttribute(selector, attributes);Set Dataset
Set dataset values for each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.keyis a string indicating the dataset value to set.valueis the value you want to set the dataset to.
$.setDataset(selector, key, value);Alternatively, you can set multiple dataset properties by passing a single dataset object as the argument with key/value pairs of the properties to set.
$.setDataset(selector, dataset);This method will convert object and array values to JSON strings.
Set HTML
Set the HTML contents for each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of node.htmlis a string that will become the HTML contents of the node.
$.setHTML(selector, html);Set Property
Set property values for each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.propertyis a string indicating the property value to set.valueis the value you want to set the property to.
$.setProperty(selector, property, value);Alternatively, you can set multiple properties by passing a single properties object as the argument with key/value pairs of the properties to set.
$.setProperty(selector, properties);Set Text
Set the text contents for each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.textis a string that will become the text contents of the node.
$.setText(selector, text);Set Value
Set the value property for each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.valueis a string that will become the value of the node.
$.setValue(selector, value);Clone Data
Clone custom data from each node to each other node.
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.cloneData(selector, otherSelector);Get Data
Get custom data for the first node.
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.keyis a string indicating the custom data value to return.
const value = $.getData(selector, key);If the key argument is omitted, an object containing all custom data values will be returned instead.
const data = $.getData(selector);Remove Data
Remove custom data for each node.
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.keyis a string indicating the custom data value to remove.
$.removeData(selector, key);Set Data
Set custom data for each node.
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.keyis a string indicating the custom data value to set.valueis the value you want to set the attribute to.
$.setData(selector, key, value);Alternatively, you can set multiple data values by passing a single data object as the argument with key/value pairs of the data to set.
$.setData(selector, data);Center
Get the X,Y co-ordinates for the center of the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the position should be calculated.offsetis a boolean indicating whether the co-ordinates should be offset from the top left of the document, and will default to false.
const center = $.center(selector, options);Constrain
Constrain each node to a container node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.containerSelectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.constrain(selector, containerSelector);Distance To
Get the distance of the first node to an X,Y position.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.xis a distance (in pixels) along the X axis.yis a distance (in pixels) along the Y axis.optionsis an object containing options for how the distance should be calculated.offsetis a boolean indicating whether the co-ordinates should be offset from the top left of the document, and will default to false.
const dist = $.distTo(selector, x, y, options);Distance To Node
Get the distance between two nodes.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const dist = $.distToNode(selector, otherSelector);Nearest To
Get the nearest node to an X,Y position.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.xis a distance (in pixels) along the X axis.yis a distance (in pixels) along the Y axis.optionsis an object containing options for how the distance should be calculated.offsetis a boolean indicating whether the co-ordinates should be offset from the top left of the document, and will default to false.
const nearest = $.nearestTo(selector, x, y, options);Nearest To Node
Get the nearest node to another node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const nearest = $.nearestToNode(selector, otherSelector);Percent X
Get the percentage of an X co-ordinate relative to the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.xis a distance (in pixels) along the X axis.optionsis an object containing options for how the percent should be calculated.offsetis a boolean indicating whether the co-ordinates should be offset from the top left of the document, and will default to false.clampis a boolean indicating whether to clamp the percent betwen 0 and 100, and will default to true.
const percentX = $.percentX(selector, x, options);Percent Y
Get the percentage of a Y co-ordinate relative to the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.yis a distance (in pixels) along the Y axis.optionsis an object containing options for how the percent should be calculated.offsetis a boolean indicating whether the co-ordinates should be offset from the top left of the document, and will default to false.clampis a boolean indicating whether to clamp the percent betwen 0 and 100, and will default to true.
const percentY = $.percentY(selector, y, options);Position
Get the X,Y position for the top/left of the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the position should be calculated.offsetis a boolean indicating whether the co-ordinates should be offset from the top left of the document, and will default to false.
const position = $.position(selector, options);Rectangle
Get the computed bounding rectangle of the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the bounding rectangle should be calculated.offsetis a boolean indicating whether the rectangle should be offset from the top left of the document, and will default to false.
const rect = $.rect(selector, options);Get Scroll X
Get the scroll X position of the first node.
selectoris a query selector string, a HTMLElement, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.
const scrollX = $.getScrollX(selector);Get Scroll Y
Get the scroll Y position of the first node.
selectoris a query selector string, a HTMLElement, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.
const scrollY = $.getScrollY(selector);Set Scroll
Scroll each node to an X,Y position.
selectoris a query selector string, a HTMLElement, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.xis a distance (in pixels) along the X axis to scroll to.yis a distance (in pixels) along the Y axis to scroll to.
$.setScroll(selector, x, y);Set Scroll X
Scroll each node to an X position.
selectoris a query selector string, a HTMLElement, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.xis a distance (in pixels) along the X axis to scroll to.
$.setScrollX(selector, x);Set Scroll Y
Scroll each node to a Y position.
selectoris a query selector string, a HTMLElement, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.yis a distance (in pixels) along the Y axis to scroll to.
$.setScrollY(selector, y);Height
Get the computed height of the first node.
selectoris a query selector string, a HTMLElement, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the height should be calculated.boxSizeis a number indicating the box sizing to calculate. Allowed values are 0 (no padding), 1 (padding), 2 (padding and border), 3 (padding, border and margin) and 4 (scroll area), and will default to 1.outeris a boolean indicating whether to use the window outer height, and will default to false.
const height = $.height(selector, options);The following constants can also be used as the boxSize for brevity.
$.CONTENT_BOX$.PADDING_BOX$.BORDER_BOX$.MARGIN_BOX$.SCROLL_BOX
Width
Get the computed width of the first node.
selectoris a query selector string, a HTMLElement, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the width should be calculated.boxSizeis a number indicating the box sizing to calculate. Allowed values are 0 (no padding), 1 (padding), 2 (padding and border), 3 (padding, border and margin) and 4 (scroll area), and will default to 1.outeris a boolean indicating whether to use the window outer width, and will default to false.
const width = $.width(selector, options);The following constants can also be used as the boxSize for brevity.
$.CONTENT_BOX$.PADDING_BOX$.BORDER_BOX$.MARGIN_BOX$.SCROLL_BOX
Add Class
Add a class or classes to each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.classesis an array of classes, or a space seperated string of class names.
$.addClass(selector, ...classes);Computed Style
Get a computed CSS style value for the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.styleis a string indicating the computed style property value to return.
const value = $.css(selector, style);If the style argument is omitted, an object containing all computed style values will be returned instead.
const css = $.css(selector);Get Style
Get a style property for the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.styleis a string indicating the style property value to return.
const value = $.getStyle(selector, style);If the style argument is omitted, an object containing all style values will be returned instead.
const styles = $.getStyle(selector);Hide
Hide each node from display.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.hide(selector);Remove Class
Remove a class or classes from each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.classesis an array of classes, or a space seperated string of class names.
$.removeClass(selector, ...classes);Remove Style
Remove a style property from each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.styleis a string indicating the style property to remove.
$.removeStyle(selector, style);Set Style
Set style properties for each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.styleis a string indicating the style property value to set.valueis the value you wish to set the style property to.optionsis an object containing options for how the style should be applied.importantis a boolean indicating the style should be set as important, and will default to false.
$.setStyle(selector, style, value, options);Alternatively, you can set multiple style properties by passing a single styles object as the argument with key/value pairs of the styles to set.
$.setStyle(selector, styles);Show
Display each hidden node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.show(selector);Toggle
Toggle the visibility of each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.toggle(selector);Toggle Class
Toggle a class or classes for each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.classesis an array of classes, or a space seperated string of class names.
$.toggleClass(selector, ...classes);Get Cookie
Get a cookie value.
nameis a string containing the name of the cookie value to retrieve.
const value = $.getCookie(name);Remove Cookie
Remove a cookie.
nameis a string containing the name of the cookie value to remove.optionsis an object containing configuration options for the cookie.expiresis a number indicating the number of seconds until the cookie will expire, and will default to -1.pathis a string indicating the path to use for the cookie.secureis a boolean indicating whether only set the cookie for secure requests, and will default to false.
$.removeCookie(name, options);Set Cookie
Set a cookie value.
nameis a string containing the name of the cookie value to set.valueis the value you wish to set the cookie to.optionsis an object containing configuration options for the cookie.expiresis a number indicating the number of seconds until the cookie will expire.pathis a string indicating the path to use for the cookie.secureis a boolean indicating whether only set the cookie for secure requests, and will default to false.
$.setCookie(name, value, options);Blur
Trigger a blur event on the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.blur(selector);Click
Trigger a click event on the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.click(selector);Focus
Trigger a focus event on the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.focus(selector);Ready
Add a function to the ready queue.
callbackis a function that will execute once the DOM has finished loading.
If the DOM is already loaded, callback will execute immediately.
$.ready(callback);Add Event
Add events to each node.
selectoris a query selector string, a HTMLElement, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.eventsis a space-separated string of events to attach to the nodes.callbackis a function that accepts aneventargument, which will be called when the event is triggered.optionsis an object containing options for how the event should be added.captureis a boolean indicating whether to use a capture event, and will default to false.passiveis a boolean indicating whether to use a passive event, and will default to false.
$.addEvent(selector, events, callback, options);Add Event Delegate
Add delegated events to each node.
selectoris a query selector string, a HTMLElement, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes.eventsis a space-separated string of events to attach to the nodes.delegateis a query selector string which will only trigger the event if it is propagated by a target matching the selector.callbackis a function that accepts aneventargument, which will be called when the event is triggered.optionsis an object containing options for how the event should be added.captureis a boolean indicating whether to use a capture event, and will default to false.passiveis a boolean indicating whether to use a passive event, and will default to false.
$.addEventDelegate(selector, events, delegate, callback, options);Add Event Delegate Once
Add self-destructing delegated events to each node.
selectoris a query selector string, a HTMLElement, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes.eventsis a space-separated string of events to attach to the nodes.delegateis a query selector string which will only trigger the event if it is propagated by a target matching the selector.callbackis a function that accepts aneventargument, which will be called when the event is triggered.optionsis an object containing options for how the event should be added.captureis a boolean indicating whether to use a capture event, and will default to false.passiveis a boolean indicating whether to use a passive event, and will default to false.
$.addEventDelegateOnce(selector, events, delegate, callback, options);Add Event Once
Add self-destructing events to each node.
selectoris a query selector string, a HTMLElement, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.eventsis a space-separated string of events to attach to the nodes.callbackis a function that accepts aneventargument, which will be called when the event is triggered.optionsis an object containing options for how the event should be added.captureis a boolean indicating whether to use a capture event, and will default to false.passiveis a boolean indicating whether to use a passive event, and will default to false.
$.addEventOnce(selector, events, callback, options);Clone Events
Clone all events from each node to other nodes.
selectoris a query selector string, a HTMLElement, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a HTMLElement, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.cloneEvents(selector, otherSelector);Remove Event
Remove events from each node.
selectoris a query selector string, a HTMLElement, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.eventsis a space-separated string of events to remove from the nodes.callbackis a function that accepts aneventargument, which will be called when the event is triggered.optionsis an object containing options for how the event should be removed.captureis a boolean indicating whether to use a capture event, and will default to null.
$.removeEvent(selector, events, callback, options);If the events, callback or capture arguments are omitted, this method will remove all matching events from each node.
Remove Event Delegate
Remove delegated events from each node.
selectoris a query selector string, a HTMLElement, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes.eventsis a space-separated string of events to remove from the nodes.delegateis a query selector string which will only trigger the event if it is propagated by a target matching the selector.callbackis a function that accepts aneventargument, which will be called when the event is triggered.optionsis an object containing options for how the event should be removed.captureis a boolean indicating whether to use a capture event, and will default to null.
$.removeEventDelegate(selector, events, delegate, callback, options);Trigger Event
Trigger events on each node.
selectoris a query selector string, a HTMLElement, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.eventsis a space-separated string of events to trigger on the nodes.optionsis an object containing options for creating the new event.datacan be used to attach additional data to the event.detailcan be used to attach additional details to the event.bubblesis a boolean indicating whether the event should bubble, and will default to true.cancelableis a boolean indicating whether the event is cancelable, and will default to true.
$.triggerEvent(selector, events, options);Trigger One
Trigger an event on the first node.
selectoris a query selector string, a HTMLElement, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.eventis an event to trigger on the nodes.optionsis an object containing options for creating the new event.datacan be used to attach additional data to the event.detailcan be used to attach additional details to the event.bubblesis a boolean indicating whether the event should bubble, and will default to true.cancelableis a boolean indicating whether the event is cancelable, and will default to true.
const cancelled = !$.triggerOne(selector, event, options);This method returns false if the event was cancelled, otherwise returns true.
Mouse Drag Event Factory
Create a mouse drag event (optionally limited by animation frame).
downis a function that accepts an event argument, which will be called when the event is started.moveis a function that accepts an event argument, which will be called when the mouse is moved during the event.upis a function that accepts an event argument, which will be called when the event has ended (mouse button has been released).optionsis an object containing configuration options for the drag event.debounceis a boolean indicating whether to debounce the move event, and will default to true.passiveis a boolean indicating whether to use passive event listeners, and will default to true.preventDefaultis a boolean indicating whether to prevent the default events, and will default to true.touchesis a number indicating the number of touches to trigger the event for, and will default to 1.
const drag = $.mouseDragFactory(down, move, up, options);This method also works with touch events.
Clone
Clone each node (optionally deep, and with events and data).
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how to clone the nodes.deepis a boolean indicating whether to also clone child nodes, and will default to true.eventsis a boolean indicating whether to also clone events, and will default to false.datais a boolean indicating whether to also clone data, and will default to false.animationsis a boolean indicating whether to also clone animations, and will default to false.
const clones = $.clone(selector, options);Detach
Detach each node from the DOM.
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const detached = $.detach(selector);Empty
Remove all children of each node from the DOM.
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.empty(selector);Remove
Remove each node from the DOM.
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.remove(selector);Replace All
Replace each other node with nodes.
selectoris a query selector string, a HTML string, a Node, HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a Node, HTMLElement NodeList, HTMLCollection, QuerySet or an array of nodes.
$.replaceAll(selector, otherSelector);If a node you are replacing with is a DocumentFragment, the fragment contents will be used as a replacement.
If multiple nodes are being replaced, cloned nodes will be created for each except for the last one.
All events, data and animations will be removed from each node that is replaced.
Replace With
Replace each node with other nodes.
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a HTML string, a Node, HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.replaceWith(selector, otherSelector);If a node you are replacing with is a DocumentFragment, the fragment contents will be used as a replacement.
If multiple nodes are being replaced, cloned nodes will be created for each except for the last one.
All events, data and animations will be removed from each node that is replaced.
Attach Shadow
Attach a shadow DOM tree to the first node.
selectoris a query selector string, aHTMLElement, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the shadow should be attached.openis a boolean indicating whether the nodes are accessible from JavaScript outside the root, and will default to true.
const shadow = $.attachShadow(selector, options);Create
Create a new DOM element.
tagNameis a string indicating the type of element you wish to create, and will default to "div".optionsis an object containing options for creating the new node.htmlis a string that will become the HTML contents of the node.textis a string that will become the text contents of the node.classis an array of classes, or a space seperated string of class names.styleis an object containing style values to set.valueis a string that will become the value of the node.attributesis an object containing attribute values to set.propertiesis an object containing property values to set.datasetis an object containing dataset values to set.
const element = $.create(tagName, options);Create Comment
Create a new comment node.
commentis a string indicating the comment.
const commentNode = $.createComment(comment);Create Fragment
Create a new document fragment.
const fragment = $.createFragment();Create Range
Create a new range object.
const range = $.createRange();Create Text
Create a new text node.
textis a string indicating the text.
const textNode = $.createText(text);After
Insert each other node after each node.
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a HTML string, a Node, HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.after(selector, otherSelector);If a node you are moving is a DocumentFragment, the contents will be moved instead.
If multiple copies of the nodes are being moved, cloned nodes will be created for each except for the last one.
Append
Append each other node to each node.
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a HTML string, a Node, HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.append(selector, otherSelector);If a node you are moving is a DocumentFragment, the contents will be moved instead.
If multiple copies of the nodes are being moved, cloned nodes will be created for each except for the last one.
Append To
Append each node to each other node.
selectoris a query selector string, a HTML string, a Node, HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.appendTo(selector, otherSelector);If a node you are moving is a DocumentFragment, the contents will be moved instead.
If multiple copies of the nodes are being moved, cloned nodes will be created for each except for the last one.
Before
Insert each other node before each node.
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a HTML string, a Node, HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.before(selector, otherSelector);If a node you are moving is a DocumentFragment, the contents will be moved instead.
If multiple copies of the nodes are being moved, cloned nodes will be created for each except for the last one.
Insert After
Insert each node after each other node.
selectoris a query selector string, a HTML string, a Node, HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.insertAfter(selector, otherSelector);If a node you are moving is a DocumentFragment, the contents will be moved instead.
If multiple copies of the nodes are being moved, cloned nodes will be created for each except for the last one.
Insert Before
Insert each node before each other node.
selectoris a query selector string, a HTML string, a Node, HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.insertBefore(selector, otherSelector);If a node you are moving is a DocumentFragment, the contents will be moved instead.
If multiple copies of the nodes are being moved, cloned nodes will be created for each except for the last one.
Prepend
Prepend each other node to each node.
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a HTML string, a Node, HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.prepend(selector, otherSelector);If a node you are moving is a DocumentFragment, the contents will be moved instead.
If multiple copies of the nodes are being moved, cloned nodes will be created for each except for the last one.
Prepend To
Prepend each node to each other node.
selectoris a query selector string, a HTML string, a Node, HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.prependTo(selector, otherSelector);If a node you are moving is a DocumentFragment, the contents will be moved instead.
If multiple copies of the nodes are being moved, cloned nodes will be created for each except for the last one.
Unwrap
Unwrap each node.
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that must match the parent of each node for it to be unwrapped.
$.unwrap(selector, nodeFilter);Wrap
Wrap each node with other nodes.
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a HTML string, a HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.wrap(selector, otherSelector);If a node you are wrapping with is a DocumentFragment, the contents will be used to wrap instead.
Wrap All
Wrap all nodes with other nodes.
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a HTML string, a HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.wrapAll(selector, otherSelector);Wrap Inner
Wrap the contents of each node with other nodes.
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a HTML string, a HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.wrapInner(selector, otherSelector);If a node you are wrapping with is a DocumentFragment, the contents will be used to wrap instead.
Parse Document
Create a Document object from a string.
inputis the input string.optionsis an object containing options for how to parse the string.contentTypeis a string representing the content type, and will default to "text/html".
const doc = $.parseDocument(input, options);Parse HTML
Return an array containing nodes parsed from a HTML string.
htmlis a string containing the HTML data to parse.
const nodes = $.parseHTML(html);Clear Queue
Clear a queue of each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how the queue should be cleared.queueNameis a string indicating the name of the queue to clear, and will default to "null".
$.clearQueue(selector, options);If the queueName is set to null, then all queues will be cleared.
Queue
Queue a callback on each node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.callbackis a function that acceptsnodeas an argument, where node is a HTMLElement. The callback can return a Promise which will pause the queue until the promise is resolved.optionsis an object containing options for how the queue should be added.queueNameis a string indicating the name of the queue to use, and will default to "default".
$.queue(selector, callback, options);If an item in the queue returns a Promise that rejects, the queue will be cleared.
Load Script
Load and execute a JavaScript file.
scriptis a string containing the URL for the script to load.attributesis an object containing additional attributes on thescripttag.optionsis an object containing options for how the script should be loaded.cacheis a boolean indicating whether to cache the request, and will default to true.
This method returns a Promise that resolves when the script is loaded, or rejects on failure.
const promise = $.loadScript(script, attributes, options);Load Scripts
Load and execute multiple JavaScript files (in order).
scriptsis a array of strings containing the URLs for the scripts to load, or an array of script attribute objects.optionsis an object containing options for how the scripts should be loaded.cacheis a boolean indicating whether to cache the request, and will default to true.
This method returns a Promise that resolves when the scripts are loaded, or rejects on failure.
const promise = $.loadScripts(scripts, options);Load Stylesheet
Import A CSS Stylesheet file.
stylesheetis a string containing the URL for the stylesheet to load.attributesis an object containing additional attributes on thelinktag.optionsis an object containing options for how the stylesheet should be loaded.cacheis a boolean indicating whether to cache the request, and will default to true.
This method returns a Promise that resolves when the stylesheet is loaded, or rejects on failure.
const promise = $.loadStyle(stylesheet, attributes, options);Load Stylesheets
Import multiple CSS Stylesheet files.
stylesheetsis a array of strings containing the URLs for the stylesheets to load, or an array of link attribute objects.optionsis an object containing options for how the stylesheets should be loaded.cacheis a boolean indicating whether to cache the request, and will default to true.
This method returns a Promise that resolves when the stylesheets are loaded, or rejects on failure.
const promise = $.loadStyles(stylesheets, options);Child
Find the first child of each node (optionally matching a filter).
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be filtered by, and will default to false.
const child = $.child(selector, nodeFilter);Children
Find all children of each node (optionally matching a filter).
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be filtered by, and will default to false.
const children = $.children(selector, nodeFilter);Closest
Find the closest ancestor to each node (optionally matching a filter, and before a limit).
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be filtered by, and will default to false.limitFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that when matched will stop the search, and will default to false.
const closest = $.closest(selector, nodeFilter, limitFilter);Common Ancestor
Find the common ancestor of all nodes.
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const commonAncestor = $.commonAncestor(selector);Contents
Find all children of each node (including text and comment nodes).
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes.
const contents = $.contents(selector);Fragment
Return the DocumentFragment of the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const fragment = $.fragment(selector);Next
Find the next sibling for each node (optionally matching a filter).
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be filtered by, and will default to false.
const next = $.next(selector, nodeFilter);Next All
Find all next siblings for each node (optionally matching a filter, and before a limit).
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be filtered by, and will default to false.limitFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that when matched will stop the search, and will default to false.optionsis an object containing options for how the siblings should be traversed.firstis a boolean indicating whether to only return the first matching node for each node, and will default to false.
const nextAll = $.nextAll(selector, nodeFilter, limitFilter, options);Offset Parent
Find the offset parent (relatively positioned) of the first node.
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const offsetParent = $.offsetParent(selector);Parent
Find the parent of each node (optionally matching a filter).
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be filtered by, and will default to false.
const parent = $.parent(selector, nodeFilter);Parents
Find all parents of each node (optionally matching a filter, and before a limit).
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be filtered by, and will default to false.limitFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that when matched will stop the search, and will default to false.optionsis an object containing options for how the parents should be traversed.firstis a boolean indicating whether to only return the first matching node for each node, and will default to false.
const parents = $.parents(selector, nodeFilter, limitFilter, options);Previous
Find the previous sibling for each node (optionally matching a filter).
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be filtered by, and will default to false.
const prev = $.prev(selector, nodeFilter);Previous All
Find all previous siblings for each node (optionally matching a filter, and before a limit).
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be filtered by, and will default to false.limitFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that when matched will stop the search, and will default to false.optionsis an object containing options for how the siblings should be traversed.firstis a boolean indicating whether to only return the first matching node for each node, and will default to false.
const prevAll = $.prevAll(selector, nodeFilter, limitFilter, options);Shadow
Return the ShadowRoot of the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const shadow = $.shadow(selector);Siblings
Find all siblings for each node (optionally matching a filter).
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be filtered by, and will default to false.optionsis an object containing options for how the siblings should be traversed.elementsOnlyis a boolean indicating whether to only return elements, and will default to true.
const siblings = $.siblings(selector, nodeFilter, options);Connected
Return all nodes connected to the DOM.
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.
const connected = $.connected(selector);Equal
Return all nodes considered equal to any of the other nodes.
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.
const equal = $.equal(selector, otherSelector);Filter
Return all nodes matching a filter.
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be filtered by.
const filtered = $.filter(selector, nodeFilter);Filter One
Return the first node matching a filter.
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be filtered by.
const filteredOne = $.filterOne(selector, nodeFilter);Fixed
Return all "fixed" nodes.
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const fixed = $.fixed(selector);Hidden
Return all hidden nodes.
selectoris a query selector string, a Node, HTMLElement, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.
const hidden = $.hidden(selector);Not
Return all nodes not matching a filter.
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be filtered by.
const not = $.not(selector, nodeFilter);Not One
Return the first node not matching a filter.
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be filtered by.
const notOne = $.notOne(selector, nodeFilter);Same
Return all nodes considered identical to any of the other nodes.
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.
const same = $.same(selector, otherSelector);Visible
Return all visible nodes.
selectoris a query selector string, a Node, HTMLElement, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.
const visible = $.visible(selector);With Animation
Return all nodes with an animation.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const withAnimation = $.withAnimation(selector);With Attribute
Return all nodes with a specified attribute.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.attributeis a string indicating the attribute value to test for.
const withAttribute = $.withAttribute(selector, attribute);With Children
Return all nodes with child elements.
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes.
const withChildren = $.withChildren(selector);With Class
Return all nodes with any of the specified classes.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.classesis an array of classes, or a space seperated string of class names to test for.
const withClass = $.withClass(selector, classes);With CSS Animation
Return all nodes with a CSS animation.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const withCSSAnimation = $.withCSSAnimation(selector);With CSS Transition
Return all nodes with a CSS transition.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const withCSSTransition = $.withCSSTransition(selector);With Data
Return all nodes with custom data.
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.keyis a string indicating the custom data value to test for.
const withData = $.withData(selector, key);If the key argument is omitted, this method will return all nodes with any custom data.
const withData = $.withData(selector);With Descendent
Return all nodes with a descendent matching a filter.
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be filtered by.
const withDescendent = $.withDescendent(selector, nodeFilter);With Property
Return all nodes with a specified property.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.propertyis a string indicating the property value to test for.
const withProperty = $.withProperty(selector, property);Find
Find all nodes matching a selector.
selectoris a query selector string to search for.contextis a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes, and will default to the Document context.
const elements = $.find(selector, context);Find By Class
Find all nodes with a specific class.
classNameis a string indicating the class name to search for.contextis a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes, and will default to the Document context.
const elements = $.findByClass(className, context);Find By ID
Find all nodes with a specific ID.
idis a string indicating the id to search for.contextis a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes, and will default to the Document context.
const elements = $.findById(id, context);Find By Tag
Find all nodes with a specific tag.
tagNameis a string indicating the tag name to search for.contextis a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes, and will default to the Document context.
const elements = $.findByTag(tagName, context);Find One
Find the first node matching a selector.
selectoris a query selector string to search for.contextis a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes, and will default to the Document context.
const element = $.findOne(selector, context);Find One By Class
Find the first node with a specific class.
classNameis a string indicating the class name to search for.contextis a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes, and will default to the Document context.
const element = $.findOneByClass(className, context);Find One By ID
Find the first node with a specific ID.
idis a string indicating the id to search for.contextis a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes, and will default to the Document context.
const element = $.findOneById(id, context);Find One By Tag
Find the first node with a specific tag.
tagNameis a string indicating the tag name to search for.contextis a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes, and will default to the Document context.
const element = $.findOneByTag(tagName, context);Index
Get the index of the first node relative to it's parent node.
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const index = $.index(selector);Index Of
Get the index of the first node matching a filter.
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be tested for.
const indexOf = $.indexOf(selector, nodeFilter);Normalize
Normalize nodes (remove empty text nodes, and join adjacent text nodes).
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.normalize(selector);Serialize
Return a serialized string containing names and values of all form nodes.
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.
const serialized = $.serialize(selector);Serialize Array
Return a serialized array containing names and values of all form nodes.
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.
const serializedArray = $.serializeArray(selector);Sort
Sort nodes by their position in the document
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.
const sorted = $.sort(selector);Tag Name
Return the tag name (lowercase) of the first node.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const tagName = $.tagName(selector);Sanitize a HTML string.
htmlis the HTML string.allowedTagsis an object containing allowed tags and attributes.
const sanitized = $.sanitize(html, allowedTags);After Selection
Insert each node after the selection.
selectoris a query selector string, a HTML string, a Node, HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.afterSelection(selector);If a node you are moving is a DocumentFragment, the contents will be moved instead.
Before Selection
Insert each node before the selection.
selectoris a query selector string, a HTML string, a Node, HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.beforeSelection(selector);If a node you are moving is a DocumentFragment, the contents will be moved instead.
Extract Selection
Extract selected nodes from the DOM.
const extracted = $.extractSelection();Get Selection
Return all selected nodes.
const selected = $.getSelection();Select
Create a selection on the first node.
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.select(selector);Select All
Create a selection on all nodes.
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.selectAll(selector);Wrap Selection
Wrap selected nodes with other nodes.
selectoris a query selector string, a HTML string, a HTMLElement, DocumentFragment, NodeList, HTMLCollection, QuerySet or an array of nodes.
$.wrapSelection(selector);If a node you are wrapping with is a DocumentFragment, the contents will be used to wrap instead.
Has Animation
Returns true if any of the nodes has an animation.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const hasAnimation = $.hasAnimation(selector);Has Attribute
Returns true if any of the nodes has a specified attribute.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.attributeis a string indicating the attribute value to test for.
const hasAttribute = $.hasAttribute(selector, attribute);Has Children
Returns true if any of the nodes has child nodes.
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes.
const hasChildren = $.hasChildren(selector);Has Class
Returns true if any of the nodes has any of the specified classes.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.classesis an array of classes, or a space seperated string of class names to test for.
const hasClass = $.hasClass(selector, ...classes);Has CSS Animation
Returns true if any of the nodes has a CSS animation.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const hasCSSAnimation = $.hasCSSAnimation(selector);Has CSS Transition
Returns true if any of the nodes has a CSS transition.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const hasCSSTransition = $.hasCSSTransition(selector);Has Data
Returns true if any of the nodes has custom data.
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.keyis a string indicating the custom data value to test for.
const hasData = $.hasData(selector, key);If the key argument is omitted, this method will return true if any of the nodes has any custom data.
$.hasData(selector);Has Dataset
Returns true if any of the nodes has a specified dataset value.
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.keyis a string indicating the custom dataset value to test for.
const hasDataset = $.hasDataset(selector, key);Has Descendent
Returns true if any of the nodes contains a descendent matching a filter.
selectoris a query selector string, a HTMLElement, DocumentFragment, ShadowRoot, Document, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be tested for.
const hasDescendent = $.hasDescendent(selector, nodeFilter);Has Fragment
Returns true if any of the nodes has a DocumentFragment.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const hasFragment = $.hasFragment(selector);Has Property
Returns true if any of the nodes has a specified property.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.propertyis a string indicating the property value to test for.
const hasProperty = $.hasProperty(selector, property);Has Shadow
Returns true if any of the nodes has a ShadowRoot.
selectoris a query selector string, a HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const hasShadow = $.hasShadow(selector);Is
Returns true if any of the nodes matches a filter.
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.nodeFilteris either a function that accepts anodeargument, a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes that the nodes will be tested for.
const is = $.is(selector, nodeFilter);Is Connected
Returns true if any of the nodes is connected to the DOM.
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.
const isConnected = $.isConnected(selector);Is Equal
Returns true if any of the nodes is considered equal to any of the other nodes.
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.optionsis an object containing options for how to perform the comparison.shallowis a boolean indicating whether to perform a shallow comparison, and will default to false.
const isEqual = $.isEqual(selector, otherSelector, options);Is Fixed
Returns true if any of the nodes or a parent of any of the nodes is "fixed".
selectoris a query selector string, a Node, HTMLElement, NodeList, HTMLCollection, QuerySet or an array of nodes.
const isFixed = $.isFixed(selector);Is Hidden
Returns true if any of the nodes is hidden.
selectoris a query selector string, a Node, HTMLElement, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.
const isHidden = $.isHidden(selector);Is Same
Returns true if any of the nodes is considered identical to any of the other nodes.
selectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.otherSelectoris a query selector string, a Node, HTMLElement, DocumentFragment, ShadowRoot, NodeList, HTMLCollection, QuerySet or an array of nodes.
const isSame = $.isSame(selector, otherSelector);Is Visible
Returns true if any of the nodes is visible.
selectoris a query selector string, a Node, HTMLElement, Document, Window, NodeList, HTMLCollection, QuerySet or an array of nodes.
const isVisible = $.isVisible(selector);