s

前端功能代码块 原

发表于 | 分类于 ， | 浏览 次

设置跨域canvas图片，微信头像直接用base64

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<canvas id="myCanvas"></canvas>
<script>
    var canvas = document.getElementById('myCanvas')
    var ctx = canvas.getContext('2d')
    canvas.width = 200
    canvas.height = 200
    var img = new Image()
    img.src = "https://wx.qlogo.cn/mmopen/vi_32/lSuIIsPv3gHw7rdoSB04Zwlw24MDnCicRDXgh8cV78dpVTUZy0JX6HjdRCBDhOSqVJIkQcLEvWwtb5oBwMFnKAQ/132"
    img.setAttribute("crossOrigin",'Anonymous')
    img.onload = function(res){
        ctx.drawImage(img,0,0,200,200)
        var _img = document.createElement('img')
        _img.src = canvas.toDataURL('jpg')
        document.body.appendChild(_img)
    }
</script>

微信动态修改title

1
2
3
4
5
6
7
8
document.title = "xxxx"
var $body = $('body');
var $iframe = $('<iframe src="/favicon.ico"></iframe>');
$iframe.on('load',function() {
  setTimeout(function() {
      $iframe.off('load').remove();
  }, 0);
}).appendTo($body);

摇一摇

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
var speed = 15;//摇动速度
var flag=true;
var x = 0,y = 0,z = 0,lastX =0, lastY = 0,lastZ = 0;
$(function(){
    if(window.DeviceMotionEvent) {
    	window.addEventListener('devicemotion', shakeHandler, false);
    }
});
function shakeHandler(event){
    var acceleration =event.accelerationIncludingGravity;//将传感值赋给acceleration
    x = acceleration.x;
    y = acceleration.y;
    z = acceleration.z;
    if(Math.abs(x-lastX) > speed || Math.abs(y-lastY) > speed ) {
    	if(flag==true){
    	   flag=false;
    	}
    }
    lastX = x;
    lastY = y;
    lastZ = z;
}

摇一摇音效播放

1
2
3
4
5
6
var load = document.getElementById('load')
load.play()
load.setAttribute('src','mp3/shakeBg.mp3')
load.load()
load.play()
// 先播放一段空音效，替换，才能播放

计算rem

1
2
3
4
5
6
7
8
9
10
11
12
(function (doc, win) {
  var docEl = doc.documentElement,
	resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
	recalc = function () {
	  var clientWidth = docEl.clientWidth;
	  if (!clientWidth) return;
	  docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';
	};
  if (!doc.addEventListener) return;
  win.addEventListener(resizeEvt, recalc, false);
  doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);

禁止连续点击

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
checkscroll();
function checkscroll(){
	 var agent = navigator.userAgent.toLowerCase();        //检测是否是ios
		var iLastTouch = null;                                //缓存上一次tap的时间
		if (agent.indexOf('iphone') >= 0 || agent.indexOf('ipad') >= 0)
		{
			document.body.addEventListener('touchend', function(event)
			{
				var iNow = new Date()
					.getTime();
				iLastTouch = iLastTouch || iNow + 1 /** 第一次时将iLastTouch设为当前时间+1 */ ;
				var delta = iNow - iLastTouch;
				if (delta < 500 && delta > 0)
				{
					event.preventDefault();
					return false;
				}
				iLastTouch = iNow;
			}, false);
		}
}

node删除文件

遍历文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
//遍历文件
const deleteFolder = function(path) {
    let files = []
    if(fs.existsSync(path)) {
        files = fs.readdirSync(path)
        files.forEach(function(file,index){
            let curPath = path + "/" + file
            if(fs.statSync(curPath).isDirectory()) { // recurse
                deleteFolder(curPath)
            } else { // delete file
                fs.unlinkSync(curPath)
            }
        });
        fs.rmdirSync(path)
    }
}

执行系统命令

1
2
3
4
var exec = require('child_process').exec,child;
child = exec('rm -rf test',function(err,out) {
  console.log(out); err && console.log(err);
});

深拷贝

1
2
3
4
5
6
7
8
9
10
11
12
13
function inCopy(obj1,obj2) {
    var obj1 = obj1 || {};//容错处理
    for (var k in obj2) {
        if(obj2.hasOwnProperty(k)){ //只拷贝实例属性，不进行原型的拷贝
            if(typeof obj2[k] == 'object') { //引用类型的数据单独处理
                obj1[k] = Array.isArray(obj2[k])?[]:{};
                inCopy(obj1[k],obj2[k]); //递归处理引用类型数据
            }else{
                obj1[k] = obj2[k]; //值类型的数据直接进行拷贝
            }
        }
    }
}