For some reason, this is happening very vaguely. Its working sometimes and sometimes it is not. The same line of code, for the different "myid" under same parent, the line -

document.getElementById("myid").parentNode is returning null.

I am quite sure that element "myid" is not a root element and its parent is a DIV which needs to be returned. I am using Firefox 3.6.10 version.

Can anyone suggest any reason why this could be happening?

EDIT: The "myid" here is some kind of a textbox or any other control element. But the parentnode is always DIV. Any controls we add are always wrapped under a DIV. So basically when something on the screen refreshes, we get the parent node and replace the innerhtml. The innerhtml could be anything.

given below is the html I have -

<div style="height: 334px; width: 769px; position: relative;">

    <span style="display: inline-block; height: 13px; width: 61px; position: absolute; left: 393px; top: 84px;" bizappid="System856UserGroupAppPoint156d5elabel300" tabindex="-1" id="System856UserGroupAppPoint156d5elabel300">User Group</span>   

    <input type="text" style="height: 20px; width: 221px; position: absolute; left: 503px; top: 77px;" bizappid="System856UserGroupAppPoint156d5etextBox190" class="formtextbox" tabindex="400" id="System856UserGroupAppPoint156d5etextBox190" readonly="readonly" name="System856UserGroupAppPoint156d5etextBox190">
</div>

In this Html, assume I am getting ParentNode for Span element, but I am not getting the same parentNode for the Input text element. Also one more strange thing is, I just added a check saying if getelementbyid is not null, then check its parentNode. Then further added if parentNode is not null then do refresh operation. Now the control is not ing inside the parentNode not null condition.

For some reason, this is happening very vaguely. Its working sometimes and sometimes it is not. The same line of code, for the different "myid" under same parent, the line -

document.getElementById("myid").parentNode is returning null.

I am quite sure that element "myid" is not a root element and its parent is a DIV which needs to be returned. I am using Firefox 3.6.10 version.

Can anyone suggest any reason why this could be happening?

EDIT: The "myid" here is some kind of a textbox or any other control element. But the parentnode is always DIV. Any controls we add are always wrapped under a DIV. So basically when something on the screen refreshes, we get the parent node and replace the innerhtml. The innerhtml could be anything.

given below is the html I have -

<div style="height: 334px; width: 769px; position: relative;">

    <span style="display: inline-block; height: 13px; width: 61px; position: absolute; left: 393px; top: 84px;" bizappid="System856UserGroupAppPoint156d5elabel300" tabindex="-1" id="System856UserGroupAppPoint156d5elabel300">User Group</span>   

    <input type="text" style="height: 20px; width: 221px; position: absolute; left: 503px; top: 77px;" bizappid="System856UserGroupAppPoint156d5etextBox190" class="formtextbox" tabindex="400" id="System856UserGroupAppPoint156d5etextBox190" readonly="readonly" name="System856UserGroupAppPoint156d5etextBox190">
</div>

In this Html, assume I am getting ParentNode for Span element, but I am not getting the same parentNode for the Input text element. Also one more strange thing is, I just added a check saying if getelementbyid is not null, then check its parentNode. Then further added if parentNode is not null then do refresh operation. Now the control is not ing inside the parentNode not null condition.

• javascript

• Is there any change going on that changes the DOM? Can you post some more code, the esp. the HTML? – Nivas Commented Oct 15, 2010 at 11:55
• Did you do some JavaScript DOM manipulations that could have killed your element or its parent? – Edgar Bonet Commented Oct 15, 2010 at 11:55
• @Nivas - The DOM is getting changed at the "myid" element's children level, but parent is not getting changed. Cannot post any code but have edited my question with more details. Hope it helps you. – Sachin Shanbhag Commented Oct 15, 2010 at 12:05
• It would help if you would post the code surrounding your getElementById call. If getElementById really returns a node inside your document, then parentNode cannot be null. Therefore, something else must be happening. – Pointy Commented Oct 15, 2010 at 12:42
• Do a "view source" on the page, copy the rendered code, and post it. No, there is no permission or anything else that would make that fail. I suspect that your "getElementById()" is itself returning null for some reason. Without seeing your actual code it is impossible to say why. – Pointy Commented Oct 15, 2010 at 12:50

3 Answers 3

If the same "id" value is shared by two or more elements on your page, then getElementById (may) return a node list instead of a DOM reference. A node list instance has no "parentNode" property.

Do not re-use "id" values for more than one element is the moral of this story.

should it be document.getElementById("myid").parentNode?

Tip for anyone who encounter a similar problem - try checking the element.isConnected property. When removing an element from it's parent DOM node it also causes the parent element to be null.