IE 6/7 - "Unspecified Error" when accessing offsetParent (Javascript) - Raj Kaimal

IE 6/7 - "Unspecified Error" when accessing offsetParent (Javascript)

I have noticed that IE 6/7 throws an "Unspecified Error" exception when it attempts to get the offsetParent property of a DOM object after the DOM tree has been modified. Here is a repro.  Remove the space in java script before viewing the page:

<html>

<head>

    <script type="text/javascript">

        var myInnerContentDiv;

        function DisplayOffsetParent() {

            try {

                alert("offsetParent is " + myInnerContentDiv.offsetParent);

            }

            catch (e) {

                alert(e.description );

            }

        }

        function InjectContent() {

            document.getElementById("myContent").innerHTML =

            'div id: myContent<div id="myInnerContent" style=border: 1px solid #FF0000;>div id: myInnerContent</div>&nbsp;';

        }

        function Init() {

            myInnerContentDiv = document.getElementById("myInnerContent");

        }

        window.onload = Init;

    </script>

</head>

<body>

    1)<a href="java script:DisplayOffsetParent()">Display offsetParent</a><br />

    2)<a href="java script:InjectContent();DisplayOffsetParent()">Inject content and display offsetParent</a>

    <hr/>

    <div id="myContent" style="border: 1px solid #0000FF;">

        div id: myContent

        <div id="myInnerContent" style="border: 1px solid #FF0000;">

            div id: myInnerContent

        </div>

        &nbsp;

    </div>

</body>

</html>


The page has two div tags - "myContent" and "myInnerContent", one nested in the other. When the page loads, we obtain a reference to the object with id "myInnerContent" and store it in a global variable.

The first link calls a function that displays the offsetParent of "myInnerContent” (we see that it is of type object). The second link calls a function that sets the innerHTML of “myContent” with some data and then tries to get the offsetParent property of "myInnerContent”.

If you are running in IE, you should see "Unspecified Error" when you click on the second link. Firefox on the other hand returns null.


You may run into this issue when you need to store a reference to an object – especially when working with AJAX.


To workaround this, you can store the id of the object in a variable rather than a reference to the object. Like so:

        //a property of some object

        var myInnerContentDivId;

        function DisplayOffsetParent() {

            alert("offsetParent is " + document.getElementById(myInnerContentDivId).offsetParent);

        }

        function Init() {

            myInnerContentDivId = "myInnerContent";

        }


Comments anyone?

Published Wednesday, November 29, 2006 8:06 PM by rajbk

Comments

# re: IE 6/7 - "Unspecified Error" when accessing offsetParent (Javascript)

What if the parent has no id defined?

Wednesday, July 4, 2007 5:24 AM by Roy

# re: IE 6/7 - "Unspecified Error" when accessing offsetParent (Javascript)

Muy bien! me sirvió!!

Monday, August 27, 2007 6:17 PM by lector agradecido

# re: IE 6/7 - "Unspecified Error" when accessing offsetParent (Javascript)

Thanks for posting this. I was experiencing the same problem and went the try..catch route.

Tuesday, April 1, 2008 1:56 PM by Michael Kebbekus

# re: IE 6/7 - "Unspecified Error" when accessing offsetParent (Javascript)

1. you get a reference to the object called myInnerContent. Lets say that this is object 100.

2. By replacing the content of the object myContent, you actually remove object 100 from the DOM and create a new object 200 and object 100 is now orphan.

3. you now try to get the parent of object 100, that no longer are in the DOM. IE gives you an error and Firefox returns null.

Monday, December 15, 2008 11:24 PM by some