// renderer.js
document.getElementById('openButton').addEventListener('click', () => {
// 使用 window.open 创建新窗口
const newWindow = window.open('new_window.html', 'New Window', 'width=400,height=300');
// 在新窗口加载完成后执行一些操作
newWindow.onload = () => {
newWindow.document.getElementById('newWindowContent').innerText = 'Hello from new window!';
};
});
在这个例子中,当点击一个按钮时,会调用 window.open 函数,打开一个名为 "New Window" 的新窗口,其内容由 new_window.html 文件提供。在新窗口加载完成后,通过 onload 事件可以执行一些操作。
以下是 new_window.html 文件的内容:
<!-- new_window.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>New Window</title>
</head>
<body>
<div id="newWindowContent"></div>
</body>
</html>
这只是一个简单的演示,你可以根据实际需求定制新窗口的样式和行为。在这个新窗口中,你可以执行一些独立于主窗口的操作。
在 Electron 应用中,window.open 函数的使用方式与在浏览器中的用法基本相同。你可以指定新窗口的 URL、名称、大小等参数。在实际应用中,你可能还需要处理新窗口的生命周期事件、与主窗口之间的通信等。
转载请注明出处:http://www.zyzy.cn/article/detail/10914/Electron