我可以打开一个新窗口并在 JavaScript 中更改调用窗口的 DOM 吗？答案

【问题标题】：Can I open a new window and change the DOM of the calling window in JavaScript?我可以打开一个新窗口并在 JavaScript 中更改调用窗口的 DOM 吗？
【发布时间】：2012-11-26 18:46:31
【问题描述】：

首先我想说我已经编写 JavaScript 大约 3 个月了，而且我不太关心通过标准或最佳实践来解决这个问题。我主要关心的是学习使用 DOM。我不想使用任何 jQuery，因为我不熟悉它。

我正在尝试使用 JavaScript 和 DOM 在我的页面上创建一个非专业的“登录”功能。首先，我使用的是“登录”屏幕，该屏幕最初会显示为“隐藏”，然后在使用时显示为“阻止”。当我通过向“登录屏幕”下方的页面主要部分添加较少的不透明度（0.1 不透明度）来在“登录”屏幕后面添加一个变暗的屏幕时，这效果很好并且看起来非常好。

当我关闭“登录”屏幕时，这个（不透明度）会恢复正常。所以你可以看到所有的东西都发生在同一个页面中，使用同一个 DOM。好的，这就是我希望它的工作方式：您创建一个用户名，然后您创建一个密码。轰隆隆，完蛋了！

但问题是：创建用户名和密码后，我希望它在登录链接最初所在的位置说“Hello (username here)”。我可以只使用 DOM 并将用户名插入 HTML 页面，但是当我提交作为登录功能的表单时，页面会重新加载并且对 DOM 的更改会被删除！

所以现在我可以告诉你我想到的解决方案：让表单（登录页面）在一个新窗口中，所以当表单被提交（并且 DOM 被操作）时，新窗口被重新加载，然后随后关闭，保留对主页面 DOM 的更改。唯一的问题是我无法弄清楚如何做到这一点。您可能会说这是一个主要问题哈哈哈。

那么，我可以从新窗口操作父窗口（即调用窗口）DOM 吗？

【问题讨论】：

您是否使用服务器端技术（ASP、PHP、JSP...）？还是只是普通的html + js？收到您提交的表单的任何内容都能够生成其 html，包括新的 Hello [username here] 消息。
我使用的是纯 html+js。我不会在任何地方发送表格。像这样：
我只是查找了 ASP，所以我对它不是很熟悉。我不做任何服务器端的事情，但我应该使用 ASP 来生成新的 html 吗？
如果您不需要发布表单，请不要这样做:) jeje，只需“检测”用户单击提交按钮即可“删除”登录 div（您的第一种方法），但不允许它进行发布，因此您可以随意操作 DOM。
感谢您不发布表单的想法。在提交表单时，我只是验证输入，然后当它被验证为正常时，我可以操作 DOM，然后我只使用 preventDefault 或 window.event.returnValue（对于 IE）来防止表单被发布并且页面不会重新加载。问题解决了。我只是需要一个好主意，谢谢 Romier。

标签： javascript dom window.open

【解决方案1】：

回应您的回答：您可以在新窗口中使用window.opener.document 修改调用者窗口的DOM；

window.opener 是对调用者窗口的引用（如果有，否则为null），但前提是两个窗口都来自same domain）。

注意：它是一个小网页，还是您要通过 javascript 在网站/应用程序上进行大量 DOM 操作？在后一种情况下，您应该使用 javascript 库/框架（我推荐 jQuery）以便更轻松地完成这项肮脏的工作。

【讨论】：

回答你的笔记。这只是我为了练习网页开发而制作的一个小网页。我听说过很多关于 JQuery 的信息，当我需要它/准备好它时，我会研究它。感谢您的回答！

【解决方案2】：

弹出窗口可以使用opener 变量找到打开它的窗口。

如果弹出窗口和原始窗口都来自同一个域，那么弹出窗口确实可以修改原始窗口的HTML。

如果弹出窗口和原始窗口包含来自不同域的内容，则由于浏览器实施的跨域保护，它们无法看到彼此的 HTML。

【讨论】：

开瓶器在我的情况下效果很好。但是开瓶器是一个变量吗？我以为这是一种方法？