是否有可能在一个文档中使用JavaScript来更改另一个文档中的HTML ?

Is it possible to use JavaScript in one document to change HTML in another?

本文关键字:文档 JavaScript 另一个 HTML 一个 是否 有可能      更新时间:2023-09-26

例如:

function change() { document.getElementById('identification').href = "http://www.stackoverflow.com"; }

相关的HTML(重要的位)

<a href="#" id="identification">Stack Overflow</a>
<input type=button value="Change" onclick="change()" />

这将改变我的标签中的href为http://www.stackoverflow.com,但说我想从一个不同的HTML文件?JavaScript将位于另一个文件的标记中,但将编辑第一个文件的内容。这可能吗?如果有,怎么做?

Javascript仅在特定页面的生命周期内存在,因此您不能让一个文件中的代码修改另一个尚未加载的文件。

根据你想要的用户体验,有一些选项:

  1. 在第一页上,使用一些javascript设置cookie,然后当第二页加载时,读取该cookie并使第二页中的javascript根据cookie值进行调整。cookie可以在同一域的页面之间共享。
  2. 而在第一页,使用一些javascript创建一个查询参数(那些东西后?在一个URL看起来像这个?show=true。当您加载第二个页面时,通过将?show=true(或您所编的任何内容)附加到URL的末尾来请求该页面。当第二个页面加载时,它可以检查URL上的查询参数,并决定如何修改自己。这是将临时参数从一个页面传递到另一个页面的最简单方法。
  3. 加载第二个页面到一个iframe(嵌入到第一个页面),当它被加载,你的javascript可以修改它(如果它是服务于同一域名作为你的主页)。
  4. 将第二页加载到第一页中,实际上是将其插入到原始页面中,或者附加它,或者替换一些现有的内容。然后,第一页的javascript可以在第二页插入HTML后修改它。
  5. 打开一个新窗口,其中包含新页面。如果它和你在同一个域名上,那么你的javascript可以到达这个新页面并修改它。

注意:当两个页面不具有相同的来源(例如相同的域)时,浏览器试图阻止页面修改。请参阅同源策略的描述。所以,如果你的问题涉及不同域名的页面,那么你需要找到一个不同的方法来解决你的问题。像插件这样的东西有时可以绕过同源策略,但常规页面javascript由于许多安全原因不能。

因为我找不到一个问题,我觉得匹配这个问题足够被关闭为确切的副本,我将发布一个答案:

是否可以在一个文档中使用JavaScript来更改另一个文档中的HTML ?

是的,假设两个窗口都在同一个安全沙箱中。

如果有,怎么做?

这很简单,您需要从您想要访问的window的上下文中调用DOM函数。

获取新窗口对象的一个简单方法是调用window.open
var newWin = window.open(newpage)

newWin是一个window对象,因此它有一个document对象以及它可能加载的所有其他DOM元素。就像任何其他窗口一样,如果您试图与页面上加载的元素进行交互,则需要等待document.readywindow.onload

newWin.onload = function(){
  var ident = newWin.document.getElementById('identification');
  ident.href = 'http://stackoverflow.com';
};