## [**webview**](https://electronjs.org/docs/api/webview-tag) 在一个独立的 frame 和进程里显示外部 web 内容。 >[danger]当Electron >= 5。 在构造`BrowserWindow`时,需要通过设置`webviewTag`webPreferences选项来启用标签 用于非本地的远程网页,可以追加远程网页的css获取事件、属性等 渲染页index.html main.js //在主入口文件main.js编写代码(main.js是主进程) //1 引入electron模块 var electron=require('electron'); //2 创建electron引用 var app=electron.app; //3 创建 electron BrowserWindow的引用 var BrowserWindow = electron.BrowserWindow; //4 变量保存对应用窗口的引用 var mianWindow=null; app.on('ready',function(){ //创建BrowserWindow的实例 赋值给win打开窗口 //软件打开的的宽度和高度 mainWindow = new BrowserWindow({ width:800, height:600, webpreferences:{ webviewTag:true//必须为true才能启用vebview //mainWindow.loadFile('index.html');//把index.html加载到窗口里面,另一种方法如下: mainWindow.loadURL(require("path").join('file:',__dirname,'index.html')); //打开窗口时开启调试模式 mainWindow.webContents.openDevTools(); //用户关闭窗口时销毁mianWindow mainWindow.on('closed',function(){ mainWindow=null; 然后命令行输入(electron空格点) electron . 渲染页index.html 渲染页index.js const wb=document.querySelect("#wb"); const loading=document.querySelect("#loading"); wb.addEventListener("did-stop-loading",function(){ loading.innerHTML="loading..."; wb.addEventListener("did-start-loading",function(){ loading.innerHTML="ok."; **preload属性可以嵌入脚本操作vebview的远程页面** 渲染页index.html ![](https://img.kancloud.cn/c2/3d/c23dc33c0b71e7364c91fd363a5c0e59_358x187.png) 渲染页test.js setTimeout(()=>{ var img_src=document.querySelect(".index-logo-src").src; alert(img_src); },5000)
  • node_modules本地安装与全局安装
  • Inspector
  • hello world
  • 使用nodejs开发桌面客户端应用
  • Electron
  • 使用 Node.js 的 API
  • 读取本地文件
  • 调用Html5的拖放api
  • 官方示例下载
  • WebView内嵌窗口
  • window.open弹出子窗口及其操作
  • BrowserWindow渲染主窗口
  • 主进程与渲染进程的通信
  • 与react结合
  • electron-forge
  • 打包工具一:electron-packager
  • 打包工具二:electron-builder
  • Boilerplates样板工程
  • 通用配置文档
  • NW.js
  • 阿斯达岁的
  • npm install、npm install --save与npm install --save-dev区别
  •