前端小技巧

1.让图文不可复制

这点应该大家 都很熟悉了， 某些时候【你懂的】为了快捷搜索答案，可是打死也不让你复制

-webkit-user-select:none;

-ms-user-select:none;

-moz-user-select:none;

-khtml-user-select:none;

user-select:none;

复制的时候自带版权信息

那有些网页为了尊重原创，复制的文本 都会被加上一段来源说明，是如何做到的呢？问的好！ 等的就是你这个问题 -_- 。

大致思路：

答案区域监听copy事件，并阻止这个事件的默认行为。

获取选中的内容（window.getSelection()）加上版权信息，然后设置到剪切板（clipboarddata.setData()）。

2.盒子垂直水平居中

4种方法实现

1、定位盒子宽高已知，position:absolute;left:50%;top:50%;margin-left:-自身一半宽度;margin-top:-自身一半高度;

2、table-cell布局父级display:table-cell;vertical-align:middle; 子级margin:0auto;

3、定位+transform;适用于子盒子宽高不定时；（这里是本人常用方法）

    position:relative/absolute;

   /*top和left偏移各为50%*/

       top:50%;

       left:50%;

   /*translate(-50%,-50%) 偏移自身的宽和高的-50%*/

    transform:translate(-50%,-50%);注意这里启动了3D硬件加速哦会增加耗电量的（至于何是3D加速请看浏览器进程与线程篇）

4、flex布局

   父级：

       /*flex 布局*/

        display:flex;

       /*实现垂直居中*/

        align-items:center;

       /*实现水平居中*/

        justify-content:center;

再加一种水平方向上居中：margin-left:50%;transform:translateX(-50%);

3.js判断设备来源

functiondeviceType(){

       varua=navigator.userAgent;

       varagent=["Android","iPhone","SymbianOS","Windows Phone","iPad","iPod"];   

       for(vari=0;i

           if(ua.indexOf(agent[i])>0){        

               break;

           }

       }

   }

    deviceType();

    window.addEventListener('resize',function(){

        deviceType();

   })

   微信的有些不太一样

   functionisWeixin(){

       varua=navigator.userAgent.toLowerCase();

       if(ua.match(/MicroMessenger/i)=='micromessenger'){

           returntrue;

       }else{

           returnfalse;

       }

   }

4.改变placeholder的字体颜色大小

其实这个方法也就在PC端可以，真机上屁用都没有，当时我就哭了。 但 还是贴出来吧

input::-webkit-input-placeholder{

   /* WebKit browsers */

    font-size:14px;

    color:#333;

}

input::-moz-placeholder{

   /* Mozilla Firefox 19+ */

    font-size:14px;

    color:#333;

}

input:-ms-input-placeholder{

   /* Internet Explorer 10+ */

    font-size:14px;

    color:#333;

}

5.最快捷的数组求最大值   

   var arr=[1,5,1,7,5,9];

   Math.max(...arr) // 9

6.更短的数组去重写法

[...newSet([2,"12",2,12,1,2,1,6,12,13,6])]