I'm teaching a course on DOM API and I'm wondering if there is any benefit to speak about getElementBy*
methods since querySelector
and querySelectorAll
methods are supported by all major browsers now?

- 101,079
- 60
- 333
- 488
-
1`getElementBy*` is more supported (as you know), but it also has better performance. [See this question](http://stackoverflow.com/questions/26848289/javascript-queryselector-vs-getelementbyid). – Spencer Wieczorek Jun 27 '16 at 09:59
-
1getElementBy* is so widely used that you can't avoid mentioning it, IMHO – Arnauld Jun 27 '16 at 10:02
-
2The DOM API is used by more than just browsers. XML document manipulation libraries and such rely on it too... – deceze Jun 27 '16 at 10:06
-
2`getElementById` is an important primitive of the DOM - as the teacher you surely know that `id` attributes are special. And often enough you don't want selectors, but something specific - you'll hardly ever write `document.querySelector("#" + id)` – Bergi Jun 27 '16 at 10:52
-
Example use case: http://stackoverflow.com/q/20306204/1048572 – Bergi Jun 27 '16 at 10:58
-
possible duplicate of [querySelector and querySelectorAll vs getElementsByClassName and getElementById in JavaScript](http://stackoverflow.com/q/14377590/1048572) – Bergi Jun 27 '16 at 11:00
-
@Bergi, thanks, what about `getElementByName` - is it still relevant nowadays? – Max Koretskyi Jun 28 '16 at 08:01
-
@Maximus: You mean `getElementsByTagName`? Same there, though it's not as common. – Bergi Jun 28 '16 at 08:07
-
@Bergi, sorry, I was referring to the [getElementsByName](https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementsByName) – Max Koretskyi Jun 28 '16 at 13:52
-
@Maximus That I would consider as deprecated as `name` attributes - they are superseded by `id`s. `getElementsByName` was (is?) a [HTML-only method](https://www.w3.org/TR/2003/REC-DOM-Level-2-HTML-20030109/), it's not part of the DOM core. – Bergi Jun 28 '16 at 14:11
-
@Bergi, got you, thanks a lot for you input – Max Koretskyi Jun 28 '16 at 14:39
2 Answers
Yes, because they will come across them in the wild and will continue to do so for years to come, also if I interviewed someone who didn't know about them I would find it odd
Feel free to show them the more modern way but I can't see these going anywhere any time soon

- 2,178
- 2
- 23
- 40
Practically, querySelector* is always the right choice. There are some cases where direct ID reference is faster; not by a lot, of course.
I believe in teaching such specific tools. High performance JS is paramount and one must know everything that can gain a few millisecs; you never know when you face a situation where the users' experience depend on such small things. But don't make them overuse it (like giving everything an ID just to be able to use this).
(Also, there's jQuery. A lot slower but gives a good solution for the rare case when querySelector is not supported.)

- 8,726
- 2
- 49
- 47
-
1Just FYI [QuerySelector](https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector) will return a single DOM node. Its `querySelectorAll` that returns a collection. – ste2425 Jun 27 '16 at 10:31