Why is this “invalid calling object” error?

Question

I write the following JS and run in IE 10:

function test() {
    var nodes = document.getElementsByTagName(\"h1\");
    document.writeln(nodes.length);
    f         


        

Answer 1

OK, I may have figured it out.

I tried this:

function test() {
    var nodes = document.getElementsByTagName("h1");
    document.writeln(nodes.length); // 1st writeln
    nodes2 = document.getElementsByTagName("h1");
    alert(nodes2.length);  //  <========= MARK1
    for (var j = 0; j < nodes2.length; j++) {
        alert(j);
            }
    document.writeln("abc");
}

No error for above code. but the MARK1 line gives 0. Because after the 1st writeln, the complete page content is re-constructed, there's no < h1 > tag in the newly constructed page any more.

And then I changed the above code to this:

 function test() {
    var nodes = document.getElementsByTagName("h1");
    document.writeln(nodes.length + "
new h1
");   // ADD a new < h1 > tag
    nodes2 = document.getElementsByTagName("h1");
    alert("node2 length = " + nodes2.length);   //MARKED
    for (var j = 0; j < nodes2.length; j++) {
        alert(j);
            }
    document.writeln("abc");
}

Now the MARKED line gave me expected length, 1. Because I put a new < h1 > tag into the newly constructed document.

As to the Invalid Calling Object error. I think because the document is re-constructed with writeln, all the DOM objects previously obtained with the old invalidated document object will be invalided, too.

The key is the implicit creation of a new document by document.writeln method.

Please correct me if I am wrong.

Thanks Guffa for the insight.