Javascript 以编程方式更改Electron中Webview的内容

因此，在我的电子应用程序中，我有一个带有侧栏（包含一些链接）的主页，然后一个网络视图占据了大部分页面。我在单独的.html文件中有一些页面，我希望能够以编程方式加载到webview中。使用iFrames，只需设置iframe的name属性（比如“content_frame”），然后将我的链接设置为：

<a id="page1_link" href="pages/page1.html" target="content_frame">page 1</a>

这是我的网络视图：

<webview nodeintegration="on" src="pages/landing_page.html" name="content_frame" height="100%" width="100%"></webview>

---

第一个页面（landing_page.html）显示得很好，但是如果我尝试以同样的方式使用webview，它将在弹出窗口中打开页面，而不是在这个嵌入的webview中。到目前为止，我一直在使用iframe，但我需要使用electron中的节点内容（iframe中的require会破坏一切）。

看起来没有一种干净的方法可以使用锚标记的target属性来实现这一点。使用一些JavaScript，您可以捕获锚的click事件，并在webview上使用loadURL来更改页面。确实有更优雅的方法来实现这一点，但这是可行的：

var webview = document.getElementsByName('content_frame')[0];
var bound = false;
webview.addEventListener("dom-ready", function() {
    if (bound) return;
    bound = true;               
    var anchors = document.getElementsByTagName("a");
    for (var a = 0; a < anchors.length; a++) {
        var anchor = anchors[a];
        if (anchor.getAttribute('target') == 'content_frame') {
            anchor.addEventListener('click', function (e) {
                e.preventDefault();
                webview.loadURL(e.srcElement.href);                
            });
        }
    }                                
});

var webview=document.getElementsByName（'content_frame'）[0]；
var-bound=false；
addEventListener（“dom就绪”，函数（）{
如果（绑定）返回；
绑定=真；
var archors=document.getElementsByTagName（“a”）；
对于（var a=0；a

但是，您必须根据此处的文档提供协议：

在webview中加载url，url必须包含协议前缀，例如http://或文件：//

---

感谢您的回复，我最终只是使用函数调用手动更改了src值，但我会保留您的回复，因为WebView有自己的问题，所以我将切换回iFrame。我将要提出一个关于在iframe中使用require（）的新问题，如果您对此有任何意见，我们将非常欢迎。