Fork me on GitHub

常用快捷键

编辑器与窗口管理

Ctrl+Shift+P: 打开命令面板。

Ctrl+Shift+N: 新建窗口。

Ctrl+Shift+W: 关闭窗口。

切分窗口：Ctrl+1/Ctrl+3/Ctrl+3

Ctrl+H：最小化窗口

Ctrl+B：显示/隐藏侧边栏

Ctrl+”+/-“：放大/缩小界面

文件操作

more >>

展开全文 >>

Audio API

HTML的

more >>

展开全文 >>

如何理解Promise

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

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

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

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

手写一个promise

more >>

展开全文 >>

OpenLayers

OpenLayers 5的体系架构可见，可把整个地图看成一个容器（Map），核心为地图图层（Layer）、对应图层的数据源（Source）与矢量图层样式（Style）、与地图表现相关的地图视图（View）.

工作原理

1
2
3
4
5
6
7
8
9
10
11
12
13
1、数据组织

    从表现形态来看，空间数据的矢量数据由点、线、面三类要素构成.
    
    矢量数据的抽象主要由ol.geom.Geometry基类下的几何对象子类实现

	几何对象子类，即
    -Point与MultiPoint（点与多点）
	-LineString与MultiLineString（线与多线）
    -Polygon与MultiPolygon（区与多区）
    -LinearRing（线性环）
	-Circle（圆），均继承于SimpleGeometry子类

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 >>

展开全文 >>

页面元素的全屏

页面元素的全屏

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 >>

展开全文 >>

对象池 

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
//对象池工厂
var objectPoolFactory = function(createObjFn) {
	var objectPool = [];

	return {
		create: function() {
			var obj = objectPool.length === 0 ?
				createObjFn.apply(this, arguments) : objectPool.shift();
			return obj;
		},
		recover: function(obj) {
			objectPool.push(obj);
		}
	}
};

// test
var iframeFactory = objectPoolFactory(function() {
	var iframe = document.createElement('iframe');
	document.body.appendChild(iframe);

	iframe.onload = function() {
		iframe.onload = null;   // 防止iframe重复加载
		iframeFactory.recover(iframe); // iframe加载完了回收节点
	}
	return iframe;
});

var iframe1 = iframeFactory.create();
iframe1.src = 'https://www.baidu.com';

var iframe2 = iframeFactory.create();
iframe2.src = 'http://www.qq.com/';

setTimeout(function() {
	var iframe3 = iframeFactory.create();
	iframe3.src = 'http://www.163.com';
}, 750);

展开全文 >>

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 >>

展开全文 >>

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

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