How get element by id with other context?

Question

I want understand how can i get a element with id of 'takeme' in other context that is not the document, for example:

<div id="parent">
  <div id="takeme"></div>
</div>

I know that i can use:

document.getElementById('takeme');

being document the context, now i want know how can i get the takeme from the parent, without using queryselectorall, so i was trying to:

var parent = document.getElementById('parent');
parent.getElementById('takeme');

but of course didn't work.

ID is unique, you can get element by ID no matter where it is in the document. — Yuriy Galanter, Jun 19 '15 at 19:54
i know, but i want understand how get elements with other context.. — , Jun 19 '15 at 19:55
to get elements of an element you can use the various getElementsBy* functions like `getElementsByTagName`,`getElementsByName`,`getElementsByClassName` etc — Patrick Evans, Jun 19 '15 at 19:57
http://stackoverflow.com/questions/6856871/getting-parent-div-of-element-javascript — Mohamed-Yousef, Jun 19 '15 at 19:57
Thanks @Mohamed-Yousef, i think you are the only one that understood that i want :P — , Jun 19 '15 at 19:58
Sounds like you need querySelector with :scope, but that's future ;-) https://developer.mozilla.org/en-US/docs/Web/CSS/:scope#Browser_compatibility — Noch_ein_Kamel, Jun 19 '15 at 19:59
@AmandaFerrari, the question Mohamed linked is asking how to get parent element, which is not at all what your question is asking — Patrick Evans, Jun 19 '15 at 20:00

AmmarCSE · Accepted Answer · 2015-06-19T20:06:42.467

getElementById for an HTMLElement will not work because getElementById is only defined for document. There is a Document.getElementById but there is not an Element.getElementById.

As commenters have mentioned, it is not needed from a parent node since the id should be unique to the document.

However, other methods like Element.getElementsByClassName should work for a different context(HTMLElement)

var parent = document.getElementById('parent');
var fromOtherContext = parent.getElementsByClassName('takeme');
console.log(fromOtherContext);

fromOtherContext = parent.getElementById('takeme');
console.log(fromOtherContext);//only works for document

<div id="parent">
  <div class="takeme"></div>
  <div class="takeme"></div>
  <div class="takeme"></div>
  <div id="takeme"></div>
</div>

score 1 · Answer 2 · answered Jun 19 '15 at 19:59

1

if you can put a class in addition to the ID

<div id="takeme" class="takeme"></div>

Then

var parent = document.getElementById('parent');
var takeme = parent.getElementsByClassName('takeme');

answered Jun 19 '15 at 19:59

www.diazis.com

86
5

How get element by id with other context?

2 Answers2