如何在新窗口中獲取dom元素？

JavaScript中的一個簡單任務是打開一個新窗口並在裏面寫入。但我需要在一個dom元素中寫入一個帶有ID的div。如何在新窗口中獲取dom元素？

var novoForm = window.open("somform.html", "wFormx", "width=800,height=600,location=no,menubar=no,status=no,titilebar=no,resizable=no,");

比我試一下...

var w = novoForm.innerWidth; 
var h = novoForm.innerHeight; 
novoForm.document.getElementById("monitor").innerHTML = 'Janela: '+w+' x '+h;

我這樣做是爲了看看對象「novoForm」是有效的。但是沒有任何東西寫在「監視器」div中。我也嘗試使用onload事件沒有成功。我想知道，如果它的一些安全限制還是我失去了一些東西......

來源

2013-04-08 Gustavo

或者，這是一個解決方案：

var novoForm = window.open("somform.html", "wFormx", "width=800,height=600,location=no,menubar=no,status=no,titilebar=no,resizable=no,"); 
var teste = function(){ 
    var mon = novoForm.document.getElementById("monitor"); 
    if(typeof(mon)!="undefined"){ 
     //novoForm.alert("Achei!"); 
     var h = novoForm.innerHeight; 
     var strh = String(h - 40 - 30)+'px'; 
     novoForm.document.getElementById("pagina").style.height = strh; 
     novoForm.document.getElementById("monitor").innerHTML = '<p class="legenda">&copy; NetArts | gustavopi</p>'; 
     clearInterval(id); 
    } 
} 
var id = setInterval(teste, 100);

這將做的工作。對我來說，這不是一個「漂亮」的解決方案，但它很有效！

來源

2013-04-08 18:35:49 Gustavo

你所做的是正確的，但你做需要確保使用onload（或輪詢），因爲它需要一段時間讓頁面在新窗口中加載。

下面是一個完整的工作示例：Live Copy | Source

(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; 
    }; 
    }; 
})();

我想知道，如果它的一些安全限制還是我失去了一些東西......

不在如圖所示，沒有，因爲頁面顯然正在從加載你的榜樣來源相同。如果URL來自不同的原產地，那麼是的，您會遇到Same Origin Policy，它禁止跨源腳本。您可以通過document.domain屬性來放鬆該屬性，使窗口包含上面的代碼和將窗口加載設置爲document.domain的值相同。從the link above：

如果兩個窗口（或幀）包含域設置爲相同的值的腳本，同樣的原產地政策放寬了這兩個窗口，每個窗口可以與其他交互。例如，從orders.example.com和catalog.example.com加載的文檔中的合作腳本可能會將其document.domain屬性設置爲「example.com」，從而使文檔看起來具有相同的來源並使每個文檔能夠讀取另一個的屬性。

更多關於document.domain可以找到on MDN。請注意，它只適用於兩個文檔共享一個共同的父域，例如，它適用於app1.example.com和app2.example.com，如果它們都設置爲example.com，但不適用於example1.com和example2.com，因爲它們沒有可以設置的共同值。

來源

2013-04-08 13:37:57

+1;不知道'document.domain'屬性。 – 2013-04-08 13:45:40

我嘗試使用onload，但是這個evenet並沒有發射。不知道爲什麼，我會做更多的測試... – Gustavo 2013-04-08 14:11:56

我並不積極，但我認爲'document.domain'只有在兩個窗口的父域名相同時才起作用。例如，Google父級和Stackoverflow彈出窗口不能使用此進行通信。不知道雖然 – Ian 2013-04-08 14:18:11

-1

取決於您嘗試加載到新窗口的網址。 @ T.J是對的。另外請注意，如果您只想加載空白文檔，則可以將「about：blank」加載到網址中。唯一的區別是您將使用outerWidth，因爲您尚未加載實際文檔。

var novoForm = window.open("about:blank", "wFormx", "width=800,height=600,location=no,menubar=no,status=no,titilebar=no,resizable=no,"); 
var w = novoForm.outerWidth; 
var h = novoForm.outerHeight; 
novoForm.document.body.innerHTML = 'Janela: '+w+' x '+h;

來源

2013-04-08 13:51:52 nobilist

如何在新窗口中獲取dom元素？

回答

相關問題