我怎样才能访问子窗口的dom树？

我用下面的代码打开一个新窗口：

purchaseWin = window.open("Purchase.aspx","purchaseWin2", "location=0,status=0,scrollbars=0,width=700,height=400"); 

我想访问purchaseWin的dom树，例如

 purchaseWin.document.getElementById("tdProduct").innerHTML = "2"; 

它不起作用。 我只能这样做：

 purchaseWin.document.write("abc"); 

我也尝试这个，它也不工作：

  $(purchaseWin.document).ready(function(){ purchaseWin.$("#tdProduct").html("2"); }); 

我该怎么办？

Answer 1

使用jQuery，您必须访问您的子窗口的文档内容 ：

 $(purchaseWin.document).ready(function () { $(purchaseWin.document).contents().find('#tdProduct').html('2'); }); 

没有库，用普通的JavaScript，你可以这样做：

 purchaseWin.onload = function () { purchaseWin.document.getElementById('tdProduct').innerHTML = '2'; }; 

我认为问题是你正试图在实际加载子窗口之前检索DOM元素。

Answer 2

也许jQuery的加载事件适用于你，因为这在类似的问题中为我工作，而就绪事件不起作用：

 $(purchaseWin).load(function(){ purchaseWin.$("#tdProduct").html("2"); }); 

Answer 3

如果您加载的页面不属于父窗口的域，则无法访问子窗口的文档。 这是由于JavaScript中内置的跨域安全性。

Answer 4

 (function() { document.getElementById("theButton").onclick = function() { var novoForm = window.open("http://jsbin.com/ugucot/1", "wFormx", "width=800,height=600,location=no,menubar=no,status=no,titilebar=no,resizable=no,"); novoForm.onload = function() { var w = novoForm.innerWidth; var h = novoForm.innerHeight; novoForm.document.getElementById("monitor").innerHTML = 'Janela: '+w+' x '+h; }; }; })();