You signed in with another tab or window.Reload to refresh your session.You signed out in another tab or window.Reload to refresh your session.You switched accounts on another tab or window.Reload to refresh your session.Dismiss alert
A JavaScript library for querying DOM elements with Regular Expressions.
This library is UMD wrapped so it can be used with or without a module loader such as requireJS.
Install
npm install --save dom-regex
Note: If this library is exposed directly to the window, it operates under the global variableDomRegex. Keepin mind you may be in an environment (ex: webpack) that requires you explicitly expose it to the window if you intendto use if from a window perspective.
Example Usage
letDomRegex=require('dom-regex');// find all elements with any data- attributeletelements=DomRegex.all(/data-[a-z]/);
The following examples and methods behave likequerySelectorAll andquerySelector. The methods that useallreturn all matching instances. The methods that useone return only the first instance found.
When not using an attribute name, the regex is applied to the entire inside contents of the element's opening tag. Ifthe tag is<div data-id="141pop"> then the regex would be applied todiv data-id="141pop"
Finding all matches on the window:
letelements=DomRegex.all(/data-[a-z]/);
Finding the first match on the window:
letelement=DomRegex.one(/data-[a-z]/);
Find all elements that have an attribute value that matches a Regular Expression
When using an attribute name, the regex is applied to the value of the attribute. If the element's opening tag was<div data-id="141pop"> and the attribute name supplied wasdata-id, then the regex would be testedagainst141pop.
Finding all matches against an attribute name:
// find all elements that have a data-id attribute that starts with 3 digitsletelements=DomRegex.all(/^\d{3}/,'data-id');
Finding one match against an attribute name:
letelement=DomRegex.one(/^\d{3}/,'data-id');
Querying children of elements
Querying "inside" of elements is much like usingquerySelectorAll on anHTMLElement(element.querySelectorAll('...')). This method takes it a step further by offering the ability to query inside listsof elements, or by using selectors.
// find all custom elements inside of #elementletelement=document.getElementById('#element');letcustomElement=DomRegex.all.inside(element,/^[a-z]+-[a-z]+/);
Querying inside elements using a selector:
// find all custom elements inside of any div with a class of "bar"letcustomElement=DomRegex.all.inside('div.bar',/^[a-z]+-[a-z]+/);
letelement=document.getElementById('#element');letcustomElement=DomRegex.all.against(element,/^[a-z]+-[a-z]+/);// if this passes, it would return the element in an array because we are using `all`
Applying regex to elements that match a selector
// this will test all divs with a class of "bar"letcustomElement=DomRegex.all.against('div.bar',/\d{3}/,'data-id');