Jump to content

Accessing Document object - belonging to different window


aptesameer
 Share

Recommended Posts

I was just exploring javascript. While doing so, I was wondering if I can access the document object belonging to a different window. To test the same, I created an html file which has function 'init()' as shown below and called it as <body onload="init();">

function init(){	var childWindow = window.open("child.html","childWindow");	var div = childWindow.document.createElement("div");	var txtNode = childWindow.document.createTextNode("ABC");	div.setAttribute("id","div9");	window.alert(11);	div.appendChild(txtNode);	var parent = childWindow.document.body;	window.alert(parent);	parent.appendChild(div);}

Now What I expected was obviously a new window with "child.html" loaded in it and 'ABC' as content. But it didn't work in Mozilla Firefox(2.0.0.7), however the same thing worked in IE(6.0)I am not able to find the reason behind this. Any help?

Link to comment
Share on other sites

Append everything before you set attributes.

function init(){  var childWindow = window.open("child.html","childWindow");  var div = childWindow.document.createElement("div");  var txtNode = childWindow.document.createTextNode("ABC");    parent.appendChild(div);  div.appendChild(txtNode);  div.setAttribute("id","div9");  alert(childWindow.document.getElementById("div9").innerHTML);}

Link to comment
Share on other sites

Thanks for the input. I tried the same but is didn't work. Is it working at your end?Also, if you put the 'alert(childWindow.document.getElementById("div9").innerHTML)' statement at the end of the init() function provided by me, it will display that inner HTML is set properly.So I think that setting attribute at later stage is immaterial. (If there are any circumstances where one has to do so, I would like to know.)So what I guess is even though DOM has been changed, firefox is not rendering the DOM changes in the window.So is there any workaround?Once again thanks for your reply.

Link to comment
Share on other sites

Thanks for the prompt reply.If you see the code posted by me then you will find the line var parent = childWindow.document.body By using parent.appendChild(div); what I am trying is - to add the newly craeted 'div' element in the body of the document.Do you think that something is wrong with it?

Link to comment
Share on other sites

Oh... parent itself is a DOM object referring to the parent of a frame - e.g. the page that created it (I think)... but I only read jsg's code and didn't see the assignment.Ooh I fixed it! Don't know whether it will work in IE though:

function init(){var childWindow = window.open("child.html","childWindow");var div = childWindow.document.createElement("div");var txtNode = childWindow.document.createTextNode("ABC");div.setAttribute("id","div9");//window.alert(11);div.appendChild(txtNode);var parent = childWindow.document.getElementsByTagName("body")[0];//window.alert(parent);parent.appendChild(div);}

Hrmm... for some reason, it only works some of the time... see whether it works for you.

Link to comment
Share on other sites

give this a try

function init(){	var childWindow = window.open("child.html","childWindow");	if(!childWindow) {		setTimeout(function(){init2(childWindow);},10);	}	else		init2(childWindow);}function init2(childWindow) {	var div = childWindow.document.createElement("div");	var txtNode = childWindow.document.createTextNode("ABC");	div.setAttribute("id","div9");	div.appendChild(txtNode);	var parent = childWindow.document.getElementsByTagName("body")[0];	parent.appendChild(div);}

play with the timeout length and see if you get more consistant results. I thing the reason it is only working sometimes is that it is taking a few milliseconds for childWindow to be created but your code is trying to use it instantly. The setTimeout should give it some "breathing room."

Link to comment
Share on other sites

Thanks a lot to all of you for your help.I tested with all proposed solutions but I didn't get contents rendered in the child window. However it is true that problem is due to "breathing room" as suggested by aspnetguy.To verify the same, I decoupled the creation of the child window and content insertion in the same and verified that it is working. [i.e. created child window on onload event of the body tag and added content to it on clicking a button.]Once again thanks to all of you.

Link to comment
Share on other sites

So I think that setting attribute at later stage is immaterial. (If there are any circumstances where one has to do so, I would like to know.)
I was doing a bunch of work using the W3C DOM methods last week and I read somewhere that it's better (in IE at least) to append before you set attributes, but I can't find where I read that now, and I also see some examples where it doesn't matter. I'm testing the scripts I find in Opera though, I'm not sure if IE would behave any differently.
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...