如何從當前html中訪問其他html的dom元素

Question

假設當前頁面是some1.html，並且有第二個頁面some2.html。如何使用JavaScript從some1.html訪問「some2.html」中的DOM元素？

Answer 1

你不能。

您的代碼顯示新頁面正在加載在同一個窗口中。

頁面1的JavaScript環境在頁面2的環境創建之前將消失。由於它們不同時存在，因此不能從另一個DOM中訪問它們。

你可以做的是將一些數據存儲在localstorage或cookie中，並讓你放置在page2中的代碼查找這些數據並根據它說的運行JS。

Answer 2

你可以試試Ajaxh，因爲正如Quentin所說，改變window.location.href會加載chaned文件。或使用iframe這樣的：

var frame= document.createElement('iframe'); 
frame.setAttribute('src', 'some2.html'); 
frame.setAttribute('name', 'some2'); 
frame.appendTo(body); 
var some2 = document.frames['name']; 
//now you can acces to some2 with getElementById,... 

Answer 3

你能做到這一點的方法是使用AJAX：

$.get(url, function(data) { 
    var $doc = $(data); 
}); 

你可以用它來從URL獲取內容，並用它做什麼。

作爲對您編輯的迴應：您可以通過執行$doc.find('selector')而不是通常的jQuery $('selector')來訪問DOM元素。

您也可以使它更容易一點做：

在這種情況下

$.get(url, function(data) { 
    var $doc = $(data); 
    var $d = $doc.find; 
}); 

你可以使用語法$d('selector')。

---

你會做到這一點沒有jQuery的方式安裝的是：

var xhr = new XMLHttpRequest(); 
xhr.open('GET', url, true); 
xhr.responseType = 'document'; 
xhr.send(); 
xhr.onload = function(e) { 
    var doc = e.target.responseXML; 
} 

，然後你可以通過doc.getElementById('id')訪問DOM元素，就像你通常選擇元素，但使用doc，而不是document。

注：這些功能，$doc，$d和doc變量只在回調函數中訪問的（所以他們只有他們定義成函數內訪問）。