如何使用 javascript 在 iframe 中编辑 html答案

【问题标题】：How can I edit html inside an iframe using javascript如何使用 javascript 在 iframe 中编辑 html
【发布时间】：2021-12-13 22:04:31
【问题描述】：

我正在努力实现业务流程的自动化，其中一部分是通过 SalesForce 发送电子邮件。我们无权访问 SF API，并且必须通过 salesforce 发送电子邮件，以便让同事可以搜索到通信。

我需要使用可以在 SalesForce 中选择的模板，但是此功能在 IE（我们的 RPA 解决方案使用）中不起作用，因此我需要从头开始构建此电子邮件。

我看到了两个选项：

使用 HTML 重新创建具有正确变量的格式。这需要插入/注入/操作 HTML。
将格式复制到内存/剪贴板，以编程方式对其进行编辑并将其粘贴到 SF 界面中

此问题将与选项 1 相关。我将单独发布关于第二个选项的附加问题，并编辑此问题以包含该链接。 编辑： Here 是另一个问题的链接！

现在进入问题：我们使用 Blue Prism RPA 软件套件。它可以将 javascript 片段插入网站并随后调用它们。我希望我可以创建一个 javascript 片段来重新创建模板，插入它然后调用它。过去一周我一直在研究这个问题，但几乎没有取得任何进展。

我现在可以将基本文本添加到必填字段中，但我发现要能够使用模板结构，我需要使用不同的基于 HTML 的字段。我发现这个字段存在于 iframe 中。

在这周之前，我在 javascript 方面的经验为零（幸运的是，它似乎与我有经验的 c# 相似），现在这个 iframe 让我很难过。显然，当您使用 Selenium 或类似设备时，您可以将驱动程序切换到新的 iframe，但我没有该选项，它需要通过表面自动化来完成。在 javascript 和控制台中，我无法将其定位到 iframe 中的单独文档。显然 iframe 内容并没有以这种方式合并到更大的网页中。

所以我的问题是：如何使用 javascript 将焦点“切换”到 iframe？然后如何通过 javascript 编辑 iframe 内容？任何帮助、提示等将不胜感激！

【问题讨论】：

标签： javascript html iframe salesforce code-injection

【解决方案1】：

如果您在浏览器中转到开发人员工具（F12 或右键单击检查），您可以使用 inpsect 工具获取您要查找的路径。 iframe 只是窗口内的另一个窗口，一旦有了“基本路径”，您就可以从 iframe 基本路径进一步延伸到窗口中。

您可以通过我知道的两种方式之一访问框架；

document.getElementById('the frame you are looking for goes here').contentWindow.targetFunction();

和/或

window.frames[0].otherfunctions

其中 0 是窗口上的第 N 帧顺序，以防有其他帧。

一旦找到该路径，您就可以通过从 iframe 中获取到该 iframe 的路径来与该 iframe 上的子元素进行交互。

一些需要注意的事情。尚未加载的框架，因此请确保已加载所需的框架，并且在运行时没有其他框架在屏幕上移动它。还要确保子框架在同一个域中，我认为调用 javascript 在跨域时会出现问题，即它不起作用（尽管可能取决于组设置，但有待纠正）

提供一些代码或页面布局，可以给你一个代码示例，但在我看来，格式看起来像这样

var doc = window.frames[0] var thing = getElementById(doc.getElementByPath('maybePath')

'执行一些设置操作，例如将 innerhtml 设置为您想要的东西

【讨论】：