程序员经验分享-hwhale

在没有窗口引用的选项卡 dom 之间进行通信[重复]

2024-03-15

我使用以下命令打开包含一些页面内容的新选项卡（在新进程中），

var p = document.getElementById("myElement"); 
var a = document.createElement('a');
a.setAttribute('href',".../mypage.html");
a.setAttribute('rel',"noreferrer");
a.setAttribute('target',"_blank");
p.appendChild(a);
a.click();

http://news.softpedia.com/news/Force-Google-Chrome-to-Open-Links-in-New-Processes-128962.shtml http://news.softpedia.com/news/Force-Google-Chrome-to-Open-Links-in-New-Processes-128962.shtml

这是有效的，新选项卡已打开，其中包含 myPage.html 内容。

假设这是 myPage（仅用于示例...）我应该如何访问它？

<!DOCTYPE html>
<html>
<body>

<h1> Heading</h1>
<p> paragraph.</p>
 <button type="button">Click Me!</button>

</body>
</html>

现在让我们去棘手/高级:) part...

当你使用window.open (我不能使用）这非常简单，因为您可以使用各种技术。

 1. using window object
 2. post message
 https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage
 3. cookies 
 4. localStorage

但在这里我打开这个新页面，没有使用 window.open 获得的参考

我的问题是：

如果我想更改某些内容，如何访问这个新选项卡 dom


父页面 JavaScript：

var lastMessage;
setInterval(function() {
  var message = localStorage.getItem('message-to-parent');
  if (message && message !== lastMessage) {
    lastMessage = message;
    // your code here
    alert('There is a new message for you: ' + message);
  }
}, 100);

子页面 JavaScript：

localStorage.setItem('message-to-parent', 'hello, my parent!');

如果你有很多动画和其他巨大的JS代码，我建议增加计时器间隔，或者更好地解决问题window.

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

javascript

html

Googlechrome

serviceworker

在没有窗口引用的选项卡 dom 之间进行通信[重复] 的相关文章

  • 如何修改 Elasticsearch 文档的 _source 字段

    问题 有没有办法从文档的 source 中清除 html html 的剥离可以是周期性的 触发的 或者理想情况下是在索引时即时进行的 我将数据输入到elasticsearch中 并针对分析器进行索引 该分析器在索引之前剥离不需要的htmls

  • 如何调试requireJS模块定义的路径/文件

    我是 RequireJS 世界的新手 我越来越Load Timeout error对于我已经在主文件中定义的模块之一 我在 Chrome 的 网络 选项卡中没有看到任何请求 可能是因为 require 之前已经加载了该文件 我已经迷上了on

  • 没有 ssl 的 Web 加密 API

    我编写了一个用于安全消息传输的小网络应用程序 以了解有关加密的更多信息 并想向我的朋友展示它并让他们玩一下 所以我将它托管在我的小服务器上 并惊讶地发现 Web Crypto API 我竭尽全力开始工作 因为它的错误消息不是很具体 需要 S

  • 从 onclick 属性调用 e.stopImmediatePropagation()

    如何从事件对象中获取事件对象onclick属性 我努力了 a href something html Click me a 另外 我也尝试过这个 a href something html Click me a 但控制台只显示 a 元素 我

  • 如何使子元素被访问/活动时父元素的颜色发生变化

    我有一个下拉导航 我想要做的是 当我单击任何子菜单链接时 我希望父按钮的颜色在链接处于活动状态时保持更改 这是代码的小提琴链接 https jsfiddle net v28ydshL https jsfiddle net v28ydshL

  • JavaScript 按属性删除对象数组中的元素

    我有一个以下形式的对象数组 prop1 value1 banks id value property2 value2 所以我想要做的是通过搜索 id 值来删除 banks 属性中的元素 然后从banks数组中删除找到的元素 id 属性具有唯

  • Bootstrap 居中 div 内的文本左对齐

    我有一段 4 行诗 位于居中的 div 中 因为它是诗歌 所以我需要将 4 行左对齐 但不要对齐到 div 的左侧 这是它的居中方式 Lorem ipsum dolor sit amet onsectetur adipisicin Dolo

  • 关闭弹出窗口后重新加载父页面

    我试图让用户通过弹出窗口登录 当他们单击弹出窗口的链接 这是一个 php 变量 时 他们可以登录 当窗口关闭时 我希望它重新加载他们最初所在的页面 父页面 这是signin php页面上的代码 但这所做的只是使登录页面成为用户所在的页面 我

  • 在React Native中在Android真实设备上运行应用程序时console.log输出在哪里

    我目前正在做一个项目 在那个项目中 我正在打印控制台日志但没有消息在任何地方打印 我在用npm 和 React native cli在真正的 Android 设备上运行 Thanks 如果您使用模拟器 可以按 Cmd M Android 或

  • 辅助功能：在密码输入中显示/隐藏密码按钮

    密码输入具有显示 隐藏按钮是很常见的 但我在网上发现很少有关于与其相关的可访问性问题的内容 我是否应该将任何类型的 ARIA 属性附加到按钮或密码输入 是一个复选框还是一个触发JS的按钮也能达到很好的效果 不知道我应该注意什么 作为一个不太

  • 无需递归即可展平多个嵌套数组的数组 - javascript

    也许这是一个愚蠢的问题 但我无法意识到是否可以在不使用递归的情况下展平多维数组 我用递归编写了一种解决方案 function transform arr var result arr forEach flatten function fla

  • jQuery 将所有 href="" 替换为 onclick="window.location="

    所以我有一个很酷的给你 我需要在渲染时扫描我的 html 文档并替换每个 href with onclick window location 不仅如此 我还需要将链接从 href 带到 window location 例如 如果我有 hre

  • 找不到模块“babel-runtime/regenerator”本地导入与从 NPM 导入

    我正在开发一个 NPM 模块 但我的 babel 配置一直存在问题 我正在使用 ES6 特别是异步 等待 静态类方法和导入 导出 首先 我遇到了一个常见问题 ReferenceError regeneratorRuntime is not

  • 允许调用函数覆盖默认选项 - jQuery UI 对话框

    我希望 CallingFunction 能够覆盖中提供的默认选项showDivPopUp功能 function calling showDivPopUp title of pop up box message to show buttons

  • 意外标记：使用映射形成对象数组[重复]

    这个问题在这里已经有答案了 我想制作这个 name james age 10 name john age 12 name johnny age 56 我的下面的代码失败了 得到了预期的令牌吗 let x name james age 10

  • CSS：结合纹理和颜色

    有人如何将用作背景图像的纹理和该纹理上方的背景颜色结合起来 这是纹理 我希望我的正文背景页面是这样的 我正在努力处理背景图像和背景颜色 http jsfiddle net 87K72 http jsfiddle net 87K72 body

  • 为什么直接访问对象文字上的属性会引发语法错误？

    当尝试访问该属性时a物体的 a 我收到错误 SyntaxError Unexpected token 有了括号一切都很好 a 为什么我首先会收到错误 有歧义吗 花括号被解释为块语句 http es5 github com x12 html

  • 使用 javascript 将子元素添加到父元素

    我正在尝试添加一个子元素 to a 父元素如下 li要添加到ul 单击 Enter 按钮或按下键盘上的 Enter 键时 会生成一个新的li and delete按钮应该添加到ul 我的代码无法正常工作 有人可以帮我解决这个问题吗 HTML

  • 如何对数字进行排序？ [复制]

    这个问题在这里已经有答案了 下面是代码 Is the sortNumber对数字进行排序的函数 a 和 b 是什么意思以及为什么存在 为什么sortNumber in n sort sortNumber 没有指定任何参数a and b Ja

  • 高图表的分散工具提示未显示

    我有一个散点图和条形图 我无法查看酒吧上方散点的工具提示 这是小提琴http jsfiddle net tZ9Rt http jsfiddle net tZ9Rt 我正在使用这两个系列 series type scatter index 2

随机推荐

  • 显示构建日期

    我目前有一个应用程序在其标题窗口中显示内部版本号 这很好 但对大多数用户来说没有任何意义 他们想知道他们是否拥有最新版本 他们倾向于将其称为 上周四的 而不是版本 1 0 8 4321 计划是将构建日期放在那里 例如 应用程序构建于 21

  • 当我从另一个方法调用方法时，React-native Bridge 为零

    但我注意到 每当我从另一个方法调用它时 我的桥变量都是零 我相信这是因为只有在从 javascript 调用桥接方法时才会设置桥接 我已经尝试了从创建委托到创建 SingleTon 类的所有方法 以上都不起作用 我不明白为什么它只能在我从

  • Streamfield 中的 Wagtail SnippetChooserBlock

    我在从片段中获取值时遇到一些问题 我已使用片段选择器块将其包含到流场中 生物片段 register snippet class BioSnippet models Model name models CharField max length

  • 无法引用函数，因为它是已删除的函数

    你好 我正在从一本书上学习 C 正在做下面的练习题 编写一个接受并返回 istream 的函数 该函数应该读取流 直到到达文件末尾 该函数应将其读取的内容打印到标准输出 在返回流之前重置流使其有效 include stdafx h incl

  • OBD2 - ELM327蓝牙模拟器[关闭]

    Closed 这个问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我正在开发 Android 应用程序 用于通过蓝牙连接到汽车单元的 ELM327 有没有模拟器可以通过

  • 使用 Gradle 添加到 WAR 包中的错误文件

    我正在使用 Gradle 1 5 并且我正在尝试适应战争插件 http www gradle org docs current userguide war plugin html到 Eclipse 动态项目 当 WAR 被 eclipse

  • 禁用该复选框时不应进行更新

    我有两页 一页是管理员 另一页是教师 管理员将科目分配给教师 教师只想选择所需的时间 我的问题是我不想对禁用的复选框执行更新查询 我已经尝试了下面的代码 但它也在更新禁用复选框 using SqlConnection con2 new Sq

  • 当 A-lx 是奇异且无解时的特征向量

    R 如何找到以下矩阵的特征向量 特征值是 2 2 所以特征向量需要求解solve matrix c 0 1 0 0 2 2 这是无解的奇异矩阵 gt eigen matrix c 2 1 0 2 2 2 values 1 2 2 vecto

  • 了解elasticsearch jvm堆的使用情况

    Folks 我正在尝试减少 Elasticsearch 部署 单节点集群 中的内存使用量 我可以看到正在使用 3GB JVM 堆空间 为了优化 我首先需要了解瓶颈 我对 JVM 使用如何分配的了解有限 字段数据看起来消耗 1 5GB 过滤器

  • 如何使用 PhpStorm 和 Xdebug 调试 AJAX (POST)？

    我已将 PhpStorm 配置为调试 HTTP GET 但仅当我直接加载页面时 当我想要调试 AJAX 时 我获取 JS 请求的 URL 并创建一个 PhpStorm 配置来调试它 不是特别优雅 是吗 当然 我不能对 POST 请求这样做

  • 什么是投影？

    从数据库理论和 NHibernate 的角度来看 使用 SetProjection 时什么是投影 投影是关系代数的基本运算之一 它采用一个关系和该关系的属性列表 可能为空 作为输入 它输出仅包含指定属性列表的关系删除重复的元组 换句话说 输

  • 多个事实的聚合解决方案

    尝试创建一个谓词 timePeriod 2 计算特定事实的两个日期之间的时间段 我已经设法自己做到这一点 但当 其他答案 存在于同一列表中时会遇到问题 即更容易用示例解释 我有以下知识基础事实 popStar Jackson 1987 19

  • 以 HTML 代码作为输入的 Angular 组件

    我正在创建一个角度组件 它显示突出显示的 HTML 代码及其执行结果 显示的 HTML 代码位于 pre html 元素内 至于结果的预览 它是硬编码的 pre class prettyprint lang html lt button t

  • 带 Join 的 TSQL Update 语句

    我有两个具有父 子关系的表 我想用孩子的数据更新父母 但是 假设有 2 个孩子 我希望能够根据孩子的其他列来选择哪个孩子用于更新 这是我到目前为止所拥有的 父级 test 孩子 exdat 预期结果 更新后父级的结果应仅包含大写字母 我想用

  • 如何在一页中执行多个查询？

    我编写了这段代码 但是当我运行它时没有输出 没有错误但是问题没有输出 如何在同一页面中执行多个查询

  • ConstraintLayout 问题 - ImageView 16:9 上边距不合适

    我想使用 ConstraintLayout 构建以下布局 我使用这个源进行布局

  • Python记录器不尊重setLevel？

    我花了一些时间浏览网站上的 Python 记录器问题 希望我的问题能在那里得到解决 我已经设置了一个带有两个流处理程序的记录器 它们具有不同的格式和日志记录级别 这是我的代码库中的功能片段 import os import time imp

  • 如何从选定的文本中获取相邻字符？

    我有一个像这样的字符串 var comment this is a test Assume this i已选择 现在我需要null 左侧 和s 右边 我怎样才能得到它们 我可以像这样获取选定的文本 function getSelection

  • Shapeless 不适用于一般环境

    我仍在尝试了解 Shapeless 以及较小程度上的 Scala 并且我一直在编写一些简单的代码来为案例类生成随机实例数据 主要基于此处的指南 http enear github io 2016 09 27 bits of shapeles

  • 在没有窗口引用的选项卡 dom 之间进行通信[重复]

    这个问题在这里已经有答案了 我使用以下命令打开包含一些页面内容的新选项卡 在新进程中 var p document getElementById myElement var a document createElement a a setA

热门标签