JS小技巧

CSS 穿透覆盖默认样式

input标签 上传type="file"，使用img遮盖，防止img阻隔点击事件

img {
  pointer-events: none;
}

自定义原生 select 控件的样式

select {
  -webkit-appearance: none;
}

文本溢出处理

//单行
.single {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
//多行
.more {
  display: -webkit-box !important;
  overflow: hidden;
  text-overflow: ellipsis;
  work-break: break-all;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; //指定行数
}

全屏居中 JS 函数

function autoCenter(el) {
  var bodyX = document.documentElement.offsetWidth || document.body.offsetWidth;
  var bodyY = document.documentElement.offsetHeight || document.body.offsetHeight;

  var elementX = el.offsetWidth;
  var elementY = el.offsetHeight;

  el.style.left = (bodyX - elementX) / 2 + "px";
  el.style.top = (bodyY - elementY) / 2 + "px";
}

防止鼠标选中事件

<div class="mask" onselectstart="return false"></div>

一像素边框设置

.folder li {
  position: relative;
  padding: 5px;
}
.folder li + li:before {
  position: absolute;
  top: -1px;
  left: 0;
  content: " ";
  width: 100%;
  height: 1px;
  border-top: 1px solid #ccc;
  -webkit-transform: scaleY(0.5);
}

彻底屏蔽鼠标右键

oncontextmenu=”window.event.returnValue=false”

取消选取、防止复制

< body onselectstart=”return false”>

JS不允许粘贴

onpaste=”return false”

JS防止复制

oncopy=”return false;” oncut=”return false;”

禁用输入法

< input style=”ime-mode:disabled”>

防止被人 frame

if (top.location != self.location)top.location=self.location;

网页禁用另存为

< no>< iframe src=*.html>< /iframe>< /no>

判断两个数组是否相同

export function scalarArrayEquals(array1, array2) {
  return array1.length === array2.length && array1.every(function(v, i) { return v ===array2[i]})
}

对象转换为数组

 var obj = {
    0: 'a',
    1: 'b',
    2: 'c',
    3: 'd',
    length: 4
}
var objArr = Array.prototype.slice.call(obj);

使用扩展运算符可以快速扁平化二维数组

const arr = [1,[2,3],[4,5]]
const flatArr = [].concat(...arr)
console.log(flatArr)//[1, 2, 3, 4, 5]

扁平化任意纬度数组

function flattenArray(arr){
  const flatArr = [].concat(...arr)
  return flatArr.some(item=>Array.isArray(item))?flattenArray(flatArr):flatArr
}
const arr = [1,[2,3],[4,5,[6,7,[8,9]]]]
console.log(flattenArray(arr))//[1, 2, 3, 4, 5, 6, 7, 8, 9]

对数组中的所有值求和

var numbers = [3, 5, 7, 2];
var sum = numbers.reduce((x, y) => x + y);
console.log(sum); // returns 17