Electron - 使用远程 url 访问加载文档中的 DOM 元素答案

【问题标题】：Electron - Access DOM elements in a loaded document using remote urlElectron - 使用远程 url 访问加载文档中的 DOM 元素
【发布时间】：2020-01-15 22:05:46
【问题描述】：

例如，我想在窗口中加载像https://google.com 这样的远程地址，但是当单击 DOM 中的按钮时，我想在主处理器中调用一个函数。

如何在webview 或iframe 中加载的文档上添加点击侦听器以与MainProcessor 通信？

编辑：实际上我无法直接访问文档的源代码，因为它是从远程 url 加载的。

【问题讨论】：

看看electronjs.org/docs/api/ipc-main
@JeffProd 问题已编辑。

标签： javascript webview electron

【解决方案1】：

您可以使用ipcRenderer 和ipcMain 在您的进程之间传递消息。

在您的网络视图中

const ipc = require('electron').ipcMain;

document.getElementById('#myDiv').addEventListener('click', () => {
    ipc.send('click', '#myDiv');
});

在你的主进程中。

const ipc = require('electron').ipcRenderer;

ipc.on('click', (event, message) => {
    console.log(message); // logs out "#myDiv"
})

【讨论】：

我的意思是我无权访问该文档来编写 JavaScript 代码，因为它是通过远程 url 加载的

【解决方案2】：

我更喜欢使用webview，并根据下面的链接在webview上设置preload标签，一切都按预期工作。
Github issues page

【讨论】：