Javascript: Page keeps loading

**alphaoide** · 05-11-2005

I have two HTML pages. The first one (index.html)has a button that will open a new window (page.html).

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>My Site</title>
<script>
function newWindow() {
  window.open( "page.html", "My Page", "width=200,height=200" );
}
</script>
</head>
<body>
<h1>Title</h1>
<p>some paragraph</p>
<input type="button" value="New" onclick="newWindow()" />
</body>
</html>

The opened window (page.html) has a button that will erase the content of parent window and write new content

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Page</title>
<script>
function eraseMe() {
  var doc = window.opener.document;
  var kids = doc.childNodes;
  for( var i = 0; i < kids.length; ++i ) {
    doc.removeChild( kids[ i ] );
  }
  
  window.opener.document.write( 
    '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">' +
    '<html>' +
    '<head></head>' +
    '<body>' +
    '<p>Mamma mia</p>' +
    '</body>' +
    '</html>'
    );
 
}
</script>
</head>
<body>
<input type="button" value="Erase" onclick="eraseMe()" />
</body>
</html>

Everything works fine except after "eraseMe()" is executed, the browser won't stop loading. New content is written, yet the hour glass stall half way and the loading icon keeps endlessly turning; like if there was an infinite loop. So, any of you spot anything?
Thanks in advance.

**ober** · 05-11-2005

Do you get any errors (lower left corner in IE, javascript console in Opera)?

Also check the source of the open document to see if all the source you expect is present. I personally would not use pop-ups in any manner since so many people block them, but whatever. It's your site.

**anonytmouse** · 05-11-2005

Code:

  for( var i = 0; i < kids.length; ++i ) {
    doc.removeChild( kids[ i ] );
  }

I doubt this is causing the problem but sometimes stepping back is better than stepping forward.

Code:

  for( var i = kids.length - 1; i >= 0; --i ) {
    doc.removeChild( kids[ i ] );
  }

**alphaoide** · 05-11-2005

Oh, the reverse loop will only make the loop faster, so I read.

**joshdick** · 05-11-2005

Originally Posted by anonytmouse

Code:

  for( var i = 0; i < kids.length; ++i ) {
    doc.removeChild( kids[ i ] );
  }

Won't length change everytime an element is removed? My suggestion is to save the initial value of length to a variable and use that variable to control the for loop.

**alphaoide** · 05-11-2005

Good point, dude. And also the index changes as you remove. So here's adjustment

Code:

  var len = kids.length;
  for( var i = 0; i < len; i++ ) {
    doc.removeChild( kids[ 0 ] );
  }

But, apparently, it is the document.write() that causes the endless loading. Hmmm...

And only in Firefox, hmm...
No error message btw

**anonytmouse** · 05-11-2005

Add a call to document.close() after you have finished writing.

>> Good point, dude. And also the index changes as you remove. <<

Which is why I suggested stepping backwards. Your solution also works but compare what happens if one of the calls to removeChild fails. If possible, a cascading failure mode should be avoided.

**alphaoide** · 05-11-2005

I see. I did not know your intention when you suggested that. Also the close() function "closes" this issue. Thanks a lot.

Javascript: Page keeps loading

LinkBack

Thread Tools

Display

Javascript: Page keeps loading

Similar Threads

JavaScript book recommendations

why page based I/O can improve performance?

web page loading ...

virtual memory

Page loading times