Find all matched selectors with RegExp in JavaScript -

Find all matched selectors with RegExp in JavaScript -

is possible in javascript find selectors using regexp?

for example, how can find selectors element1, element2, ... element21341234?

document.queryselectorall('.element + [regexp]')

given info provided, i'd suggest:

class="snippet-code-js lang-js prettyprint-override">// using array.prototype.filter, filter elements returned // 'document.queryselectorall()' var elementprefixed = [].filter.call(document.queryselectorall('[class*=element]'), function(el) { // '\b' word-boundary, // 'element' literal string // \d+ string of numeric characters, of length 1 or more: homecoming (/\belement\d+\b/).test(el.classname); }); // iterates on found elements, show elements found: [].foreach.call(elementprefixed, function(el) { el.style.color = '#f90'; }); class="snippet-code-css lang-css prettyprint-override">div { height: 2em; border: 1px solid #000; margin: 0 auto 0.5em auto; width: 50%; } div[class]::before { content: attr(class); } class="snippet-code-html lang-html prettyprint-override"><div class="element1"></div> <div class="element2"></div> <div class="element3"></div> <div class="element4"></div> <div class="elementother"></div> <div class="element"></div> <div class="2element"></div> <div class="3element1"></div> <div class="4element15"></div>

alternatively, it's possible extend document prototype offer document.getelementsbyregex() method:

// adding method document.prototype: document.prototype.getelementsbyregex = function (attr, reg) { // attr: string, attribute of element wish search by, // reg: regexp literal should perform search. // here find elements in document specific attribute: var superset = document.queryselectorall('[' + attr + ']'); // if there no elements attribute, homecoming null: if (!superset.length) { homecoming null; } else { // otherwise homecoming filtered array, of elements // have attribute matching regular expression: homecoming [].filter.call(superset, function (el) { // we're using 'el.getattribute(attr),' rather el[attr], // because searching class require el[classname], , 'for' // require el[htmlfor]; getattribute irons out kinks: homecoming reg.test(el.getattribute(attr)); // note method returns array, not nodelist (live or otherwise) // unlike document.getelementsbyclassname() illustration }); } };

class="snippet-code-js lang-js prettyprint-override">// adding method document.prototype: document.prototype.getelementsbyregex = function (attr, reg) { // attr: string, attribute of element wish search by, // reg: regexp literal should perform search. // here find elements in document specific attribute: var superset = document.queryselectorall('[' + attr + ']'); // if there no elements attribute, homecoming null: if (!superset.length) { homecoming null; } else { // otherwise homecoming filtered array, of elements // have attribute matching regular expression: homecoming [].filter.call(superset, function (el) { // we're using 'el.getattribute(attr),' rather el[attr], // because searching class require el[classname], , 'for' // require el[htmlfor]; getattribute irons out kinks: homecoming reg.test(el.getattribute(attr)); // note method returns array, not nodelist (live or otherwise) // unlike document.getelementsbyclassname() illustration }); } }; console.log(document.getelementsbyregex('id', /\belement\d+\b/)); class="snippet-code-css lang-css prettyprint-override">div { height: 2em; border: 1px solid #000; margin: 0 auto 0.5em auto; width: 50%; } div[class]::before { content: attr(class); } class="snippet-code-html lang-html prettyprint-override"><div class="element1"></div> <div class="element2"></div> <div class="element3"></div> <div class="element4"></div> <div class="elementother"></div> <div class="element"></div> <div class="2element"></div> <div class="3element1"></div> <div class="4element15"></div>

references:

css: attribute-presence , value selectors. substring-matching ([attribute*=value]) attribute selectors. javascript: array.prototype.filter(). array.prototype.foreach(). element.getattribute(). function.prototype.call(). javascript regular expressions. regexp.test().

javascript