问题描述
我需要使用Chrome开发人员工具完成与“检查元素”功能非常相似的操作（请参见随附的屏幕截图）。 
我要寻找的主要内容是能够识别并突出显示给定页面上的元素。我可以显示一个叠加层，向该元素添加一个类，等等。我知道使用iFrame并尝试通过iFrame访问和操作DOM，因为它具有跨域功能，因此无法直接使用。如果您可以控制该站点，我也知道有关帖子的信息，但是我可能并非一直如此。我遇到的主要问题是，我只是试图在页面上临时突出显示元素，就像单击“检查元素”并显示它一样。当用户在我的应用程序中加载网站时，不需要突出显示任何特定内容（例如，h1标签），就不需要保留任何内容。如果有办法的话，甚至可以使用chrome开发人员工具的功能，使您可以“按HTML进行编辑”。
是否可以使用iFrame，新标签页或其他任何方式来突出显示提供URL的给定网站上的元素？我附加了“目标”的另一张图片。
解决方法
似乎您可以通过三个选项来突出显示元素。
1。浏览器扩展
2。通过postMessage发送事件以指示iframe网站操纵其DOM
3。通过postMessage发送事件，以接收有关DOM和iframe顶部的叠加元素位置的信息。
＃1似乎需要更长的时间进行大修。仅当您始终可以访问iframe中的网站时，才能使用＃2和3。
https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage
window.postMessage（）方法安全地启用Window对象之间的跨域通信；例如，在页面与其产生的弹出窗口之间，或在页面与嵌入其中的iframe之间。