从 div 内的另一个页面访问 html 元素

Question

所以我对 html/javascript 很陌生，但我正在做一个项目，我在 div 中加载一个外部 html 页面，加载时看起来像这样：

<div class="content" id="content">
 <object type="text/html" data="./ProjectsHTML/radio_project.html">
   #document
 </object>
</div>

“#document”内部是外部 html。此外部 html 包含一些可以最小化和最大化以隐藏/显示其内容的标题。

我在主 html 上有一个显示所有标题的侧边菜单（标题在侧边菜单上是硬编码的），我想 访问外部 html 内的标题位置 所以当点击侧边菜单的标题时，外部 html 会自动滚动到该标题的位置。

如果它对解决方案有用，我正在使用 Electron。

请帮忙:)

Answer 1

假设页面来自同一个域，here 会解决类似的问题。

但是，如果 iframe 中的页面来自不同的域，您将无法访问单个元素 - 那是 cross-site scripting，这是一个安全漏洞。

如果您拥有这两个页面，即使它们位于不同的域中，也有一些选择：

1. 您可以将HTML links/bookmarks 添加到 iframe 中的页面，然后在用户单击主机页面上的菜单选项时重新加载 iframe。如果需要在 iframe 中重新加载页面，但它可用于获得类似的行为。
2. 您可以post messages 到 iframe 并在托管页面中处理“滚动请求”。您需要小心验证这些消息的来源。