How to get elements from HTML document using JavaScript by specific tags reg expression?

Question

I want to get all elements from document which starts with ge-. Example <ge-survey></ge-survey> <ge-sombody></ge-sombody> <ge-...></ge-...>.

var elements = document.getElementsByTagName("*"); // <<-- now return all

also I tried :

var elements = document.querySelectorAll("^=ge-");

but get :

geadele.js:3 Uncaught SyntaxError: Failed to execute 'querySelectorAll' on 'Document': '^=ge-' is not a valid selector.

Also I tried:

var els = document.getElementsByTagName("^=ge-"); // return epty HTMLcollection

my html:

...
</head>
<body>
  <ge-survey></ge-survey>
  <ge-element></ge-element>
</body>
...

no I want get array of elements from HTML document by tags <ge-xxx> using reg expresions. It is question about JavaScript reg expressions more. — Edgaras Karka
– Edgaras Karka, Commented Dec 1, 2016 at 9:33
developer.mozilla.org/nl/docs/Web/API/Document/querySelector — Mahi
– Mahi, Commented Dec 1, 2016 at 9:38

Antonio · Accepted Answer · 2016-12-01 10:08:08Z

1

If you know all ge-elements, which you want to get, you can use document.getElementsByTagName('ge-somebody') and concatenate result.

var ge1Elements = Array.prototype.slice.call(document.getElementsByTagName('ge-1'));
var ge2Elements = Array.prototype.slice.call(document.getElementsByTagName('ge-2'));
...
var geElements = [].concat(ge1Elements, ge2Elements, ge3Elements);

In my opinion this approach in documents with a large number of elements is faster than regexp, but I didn't any benchmarks.

If you don't know all posible ge- elements, you can get it by filtering all elements:

var elements = document.getElementsByTagName("*");
var geElements = [];
for(var i = 0; i < elements.length; i++){
    if(elements[i].tagName.indexOf('GE-') === 0){
      geElements.push(elements[i]);
    }
}
console.log(geElements);

edited Dec 1, 2016 at 10:08

answered Dec 1, 2016 at 9:55

Antonio

9015 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Edgaras Karka Over a year ago

I tried it but I thing is better use prepared JavaScript decision with reg expressions, not need write more code;

Edgaras Karka Over a year ago

I dont know about ge elements in html.

Antonio Over a year ago

@EdgarasKarka If you don't know a set of all ge-tags, you should use the second approach with filtering any collection of html-elements by tagName matching

Community · Accepted Answer · 2017-05-23 10:30:14Z

0

You can use document.querySelector and use a 'starts with' type css selector: Can I use a regular expression in querySelectorAll?

edited May 23, 2017 at 10:30

CommunityBot

11 silver badge

answered Dec 1, 2016 at 9:36

Kraylog

7,6131 gold badge28 silver badges37 bronze badges

1 Comment

Edgaras Karka Over a year ago

I tried document.querySelectorAll("^=ge-"); but get error. Look to post

Collectives™ on Stack Overflow

How to get elements from HTML document using JavaScript by specific tags reg expression?

2 Answers 2

3 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related