Fork me on GitHub

electron 拓展

Electron

2021-01-01 - 2022-04-27 下载量 34,441,621 GitHub star 101k

html+css+js一直是网页开发的三剑客，不过经过electron的整合，现在它们也能够开发桌面应用程序。它采用chromium引擎ui，可以非常方便地进行跨平台页面的开发。并且它可以访问诸如Developer Tools和Storage Access之类的工具，使得它开发桌面程序更加方便。

img

more >>

展开全文 >>

electron 基础知识

基础应用

此笔记参考 刘晓伦著作的 ELectron实战：入门、进阶与性能优化

1、安装

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
- npm i electron -D

// 在安装步骤执行到 > node install.js 时，按ctrl+c中断过程
// 应为下载太慢了

- 手动下载 所需zip包

https://www.electronjs.org/fiddle

- 本地缓存目录为  ~/.electron/electron-v1.4.5-darwin-x64.zip

- 手动下载的zip包放到缓存目录所在位置。

- 重新执行 npm install -g electron 即可


上面的下载地址和缓存目录是通过阅读install.js脚本，尝试执行并打印部分变量得到的。
对于很多其它的使用npm安装的功能模块，都可以通过这个方法，解决下载问题。

安装成功后可以在项目 运行 ./node_modules/.bin/electron 测试
more >>

展开全文 >>

如何理解Promise

Promise 是一个对象，可以产生一个值或者它会返回一个没有产生值的原因。解决了回调地狱

1
2
3
4
5
1、同步的代码（最高）

2、微任务的异步代码（次高）.then()的优先级高于setTimeOut

3、宏任务的异步代码（最低）

手写一个promise

more >>

展开全文 >>

Audio API

HTML的

more >>

展开全文 >>

页面元素的全屏

页面元素的全屏

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
//1、全屏

function fullScreen(ele){
     const target = document.getElementById(ele);
     if(target.RequestFullScreen){
         target.RequestFullScreen();
      }
      //兼容火狐
      if(target.mozRequestFullScreen){
        target.mozRequestFullScreen();
      }
      //兼容谷歌等可以webkitRequestFullScreen也可以webkitRequestFullscreen
      if(target.webkitRequestFullScreen){
        target.webkitRequestFullScreen();
      }
      //兼容IE,只能写msRequestFullscreen
      if(target.msRequestFullscreen){
        target.msRequestFullscreen();
      }
}

//2、退出全屏
function exitFullScreen(){
     const target = document;
     if(target.exitFullScreen){
        target.exitFullscreen()
      }
      //兼容火狐
      if(target.mozCancelFullScreen){
        target.mozCancelFullScreen()
      }
      //兼容谷歌等
      if(target.webkitExitFullscreen){
        target.webkitExitFullscreen()
      }
      //兼容IE
      if(target.msExitFullscreen){
        target.msExitFullscreen()
      }
}
more >>

展开全文 >>

js/jquery获取其他窗口的元素

js/jquery获取其他窗口的元素

1、获取 iframe 中的元素

1
2
3
4
5
//获取iframe页面中的document
let doc = window.frames['Iframe name 属性'].document;
let doc = document.getElementById('Iframe 的id').contentDocument;
//然后就可通过doc对象获取其中的元素了
【注意，需要在 onload事件中使用】

2、获取父级窗口元素

more >>

展开全文 >>

文件下载方式

文件下载方式

  1. get方式下载

    window.location.href = URL

    window.open(URL)

  2. post方式

  • form表单

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    var formObj = document.createElement('form');
              formObj.action = downloadURL;//设置下载路径
              formObj.method = method;//设置请求方式
    		 //formObj.enctype = 'multipart/form-data' 设置Content-Type
              formObj.style.display = 'none';//样式隐藏
              var addFormItem = (formObj,formItemName,formItemValue) => {
                let formItem = document.createElement('input');
                formItem.name = formItemName; // 传参的字段名
                formItem.value = formItemValue; // 传参的值
                formObj.appendChild(formItem)
              }
              addFormItem(formObj,'token',localStorage.getItem('accessToken'))//设置token参数
    		 //设置其他参数
              for(let data_key in data){
                addFormItem(formObj,data_key,data[data_key])
              }
        
              document.body.appendChild(formObj);//加入document
              formObj.submit();//触发submit事件
              document.body.removeChild(formObj);//移除dom
more >>

展开全文 >>

tag:

    缺失模块。
    1、请确保node版本大于6.2
    2、在博客根目录（注意不是yilia-plus根目录）执行以下命令：
    npm i hexo-generator-json-content --save

    3、在根目录_config.yml里添加配置： 

      jsonContent:
    meta: false
    pages: false
    posts:
      title: true
      date: true
      path: true
      text: false
      raw: false
      content: false
      slug: false
      updated: false
      comments: false
      link: false
      permalink: false
      excerpt: false
      categories: false
      tags: true

侠客行
作者：李白
赵客缦胡缨，吴钩霜雪明。
银鞍照白马，飒沓如流星。
十步杀一人，千里不留行。
事了拂衣去，深藏身与名。
闲过信陵饮，脱剑膝前横。
将炙啖朱亥，持觞劝侯嬴。
三杯吐然诺，五岳倒为轻。
眼花耳热后，意气素霓生。
救赵挥金槌，邯郸先震惊。
千秋二壮士，烜赫大梁城。
纵死侠骨香，不惭世上英。
谁能书阁下，白首太玄经。