some small knowledge

cookie 增查

<!--1.语义化标签的作用-->
<!--1.1 从开发角度考虑是提高代码的可读性可维护性-->
<!--1.2 网站的发布者：seo 搜索引擎优化 -->
 
<!--2.语义化标签的兼容问题-->
<!--2.1 IE9以下不支持H5标签（大部分css3属性，一些H5的api）-->
<!--2.2 IE9以下不认识，把这些标签当做行内元素去看待-->
<!--2.3 语义化标签需要动态创建 document.createElement('header') 同时设置块级元素-->
<!--2.4 有一款插件能帮你完成这件事件  html5shiv.js   -->
<!--2.5 必须引入在头部，在页面结构之前，提前解析h5标签-->
<!--2.6 优化处理：支持H5标签的不需要加载，IE9以下不支持H5加载-->
<!--2.7 js判断客户的浏览器版本可以做到，但是不能做到js提前加载-->
<!--2.8 条件注释：网页的任何地方  根据浏览器版本去加载内容（html标签）-->
<!--2.9 固定语法  lt 小于  gt 大于  lte 小于等于  gte 大于等于 -->
 
条件注释

<!--[if lte IE 8]>
<script src="html5shiv.min.js"></script>
<![endif]-->

获取最近个月的时间
import moment from 'moment';
// 默认选择时间为最近7天
 const defaultSelectDate = {
    startDate: moment().startOf('day').subtract(, 'days').format("YYYY-MM-DD"),
    endDate: moment().endOf('day').format("YYYY-MM-DD")
  }
  // 选择时间限制,区间是今天往前的3个月，也就是最近三个月
  const limitSelectDate = {
    min: moment().startOf('day').subtract(, 'months').format("YYYY-MM-DD"),
    max: moment().endOf('day').format("YYYY-MM-DD")
  }
 
defaultSelectDate {startDate: "2019-09-19", endDate: "2019-09-25"}
 limitSelectDate {min: "2019-08-25", max: "2019-09-25"}

js 时间格式转换
<script type="text/javascript">
    // 获取当前时间戳(以s为单位)
     var timestamp = Date.parse(new Date());
    timestamp = timestamp / 1000;
    //当前时间戳为：1403149534
     console.log("当前时间戳为：" + timestamp);
    // 获取某个时间格式的时间戳
    var stringTime = "2018-07-10 10:21:12";
    var timestamp2 = Date.parse(new Date(stringTime));
    timestamp2 = timestamp2 / 1000;
    //2018-07-10 10:21:12的时间戳为：1531189272
    console.log(stringTime + "的时间戳为：" + timestamp2);
    // 将当前时间换成时间格式字符串
     var timestamp3 = 1531189272;
     var newDate = new Date();
     newDate.setTime(timestamp3 * 1000);
    // Wed Jun 18 2018
    console.log(newDate.toDateString());
    // Wed, 18 Jun 2018 02:33:24 GMT
     console.log(newDate.toGMTString());
    // 2018-06-18T02:33:24.000Z
    console.log(newDate.toISOString());
    // 2018-06-18T02:33:24.000Z
    console.log(newDate.toJSON());
    // 2018年6月18日
    console.log(newDate.toLocaleDateString());
    // 2018年6月18日 上午10:33:24
    console.log(newDate.toLocaleString());
    // 上午10:33:24
     console.log(newDate.toLocaleTimeString());
    // Wed Jun 18 2018 10:33:24 GMT+0800 (中国标准时间)
    console.log(newDate.toString());
    // 10:33:24 GMT+0800 (中国标准时间)
    console.log(newDate.toTimeString());
     // Wed, 18 Jun 2018 02:33:24 GMT
     console.log(newDate.toUTCString());
Date.prototype.format = function(format) {
    var date = {
        "M+": this.getMonth() + 1,
        "d+": this.getDate(),
        "h+": this.getHours(),
        "m+": this.getMinutes(),
        "s+": this.getSeconds(),
        "q+": Math.floor((this.getMonth() + 3) / 3),
        "S+": this.getMilliseconds()
    };
    if (/(y+)/i.test(format)) {
            format = format.replace(RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length));
        }
    for (var k in date) {
       if (new RegExp("(" + k + ")").test(format)) {
            format = format.replace(RegExp.$1, RegExp.$1.length == 1
                ? date[k] : ("00" + date[k]).substr(("" + date[k]).length));
       }
     }
     return format;
 }
 console.log(newDate.format('yyyy-MM-dd h:m:s'));
 </script>

H5 知识

H5 api
1. querySelector() 获取符合选择器的第一个元素
2. querySelectorAll() 获取符合选择器的所有元素

1. jquery操作类的方法：addClass() removeClass() toggleClass() hasClass()
2. h5也有类似的api 基于一个对象classList的方法 add() remove() toggle() contains()     //contains判断有误类，返回布尔值
 
eg:
<script>
    var dom = document.querySelector('li:nth-child(2)');
    /*1.获取类*/
    console.log(dom.classList);
    /* DOM.classList  获取的是这个DOM元素上的所有class */
    /*2.操作类*/
    dom.classList.add('blue');
    dom.classList.remove('red');
 
    document.querySelector('button').onclick = function () {
        dom.classList.toggle('toggle');
        console.log(dom.classList.contains('red'));
    }
</script>
 
H5自定义属性 ： date-*
H5的date-*属性： 更改的是DOM
　　var div= document.querySelector('div') //获取
　　div.dateset      //获取元素的所有date  对象
　　div.dateset.user  //获取单个
 
jQuery的date-*属性 ： 更改的是内存（对象存储的位置内存，并不修改DOM）
$('div').date()      //获取所有date属性
$('div').date('user')　　　　// 获取单个
$('div').date('user','16')　　//设置属性值

<meta http-equiv="refresh" content="0; url=">    404重定向
页面定期刷新，如果加url的，则会重新定向到指定的网页，content后面跟的是时间（单位秒），把这句话加到指定网页的<head></head>里

分享到Facebook links yotube

  <div class=fx><a class=fb href="javascript:window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(document.location.href)+'&t='+encodeURIComponent(document.title),'_blank','toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=600, height=450,top=100,left=350');void(0)"></a>
            <a class=ytb href=#></a> <a class=tw href="javascript:window.open('http://twitter.com/home?status='+encodeURIComponent(document.location.href)+' '+encodeURIComponent(document.title),'_blank','toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=600, height=450,top=100,left=350');void(0)"></a>
            <a class=in href="javascript:window.open('http://www.linkedin.com/shareArticle?mini=true&url='+encodeURIComponent(document.location.href)+'&title='+encodeURIComponent(document.title)+'&source='+encodeURIComponent(document.location.href),'_blank','toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=600, height=450,top=100,left=350');void(0)"></a>
        </div>

JsFormat：

这里下载这插件包 https://github.com/jdc0589/JsFormat ，点油下角的zip就能下载

使用方法：

1、快捷键：ctrl+alt+f

html-css-js prettify：

1、快捷键：ctrl+shift+P

3、输入html-css-js prettify，选择html-css-js prettify

电子数据相关的取证：网站被侵权等

https://www.egongzheng.com/help/53.htm

http://www.24qz.cn/

http://quzheng.baidu.com/?tdsourcetag=s_pctim_aiomsg&qq-pf-to=pcqq.discussion

　　https://chenhuichao.com/    陈回潮的学习博客

//安装ruby 配置sass 环境
 
移除之前的环境，使用国内镜像
gem sources --add https://gems.ruby-china.com/ --remove https://rubygems.org/
 
//安装完成之后，查看源
gem sources -l
 
//提示如下

*** CURRENT SOURCES ***

https://gems.ruby-china.com/

gem install sass
 
编译参数：--no-cache %FileName% %FileBaseName%.css --style compact
参考链接：https://gems.ruby-china.com/

滚动到页头
<script>
 
        $(window).scroll(function(){
      $("#scrolls").click(function(){
            $("html, body").animate({scrollTop:0 },300);
        })
    });
    </script>

监听span里面text 文本的变化触发事件
$("#select2-chosen-6").bind("DOMNodeInserted",function(e){
     console.log($(e.target).html());
})

jquery : stickUp

#获取访问用户的IP地址
<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script> 
 
      document.write(returnCitySN["cip"]+','+returnCitySN["cname"])

 $.ajax({
 
             type: "POST",
 
             url: "test.json",
 
             data: {ip:'168.122.122.12'},
 
             dataType: "json",
 
             success: function(data){
 
            }
 
         });

请求轮询：数据实时更新——每隔xx秒需要刷新一次接口——即需要用到定时器相关原理，只使用setInterval 会造成定时器叠加，致页面卡死
window.setInterval(() => {
  setTimeout(fun, 0)
}, 30000)

//点击遮罩层隐藏，解决方案是便是判断event target ，并且保证 这个时间不会冒泡。
$('.overlay').click(function(e){
  if (e.target == e.currentTarget)
    closeOverlay();
});

cookie小记
//判断cookie是否存在
getCookie(name)
        {
            var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
            if(arr != null) {
                this.options=JSON.parse(arr[2])
            }else{
                this.getScreen()
            }
        }
 
//设置增加cookie   params: exdays(定时过期)
设置定cookie 为数组内含对象时需要转换为字符串 eg: var data=[{a:1},{a:2}]     JSON.stringify(data)

setCookie(c_name,exdays) {
                    var exdate = new Date();
                    exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays);
                    window.document.cookie = "secondCategory" + "=" + c_name + ";path=/;expires=" + exdate.toGMTString();
        }

修改滚动条样式
/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
::-webkit-scrollbar
{
    width: 4px;  /*滚动条宽度*/
    height: 10px;  /*滚动条高度*/
}  
 
/*定义滚动条轨道 内阴影+圆角*/
::-webkit-scrollbar-track
{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;  /*滚动条的背景区域的圆角*/
    background-color: #eee;/*滚动条的背景颜色*/
}  
 
/*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb
{
    border-radius: 10px;  /*滚动条的圆角*/
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #999;  /*滚动条的背景颜色*/
}  

// 对象深度克隆方法
export function cloneObj(obj) {
  let str;
  let newobj = obj.constructor === Array ? [] : {};
  if (typeof obj !== 'object') {
    return;
  } else if (window.JSON) {
    str = JSON.stringify(obj); // 序列化对象
    newobj = JSON.parse(str); // 还原
  } else {
    // 如果不支持以上方法
    for (const i in obj) {
      if ({}.hasOwnProperty.call(obj, i)) {
        newobj[i] = typeof obj[i] === 'object' ? cloneObj(obj[i]) : obj[i];
      }
    }
  }
  return newobj;
}

邮箱校验：
REGEX_EMAIL = "^([a-z0-9A-Z]+[-|\\.]?)+[a-z0-9A-Z]@([a-z0-9A-Z]+(-[a-z0-9A-Z]+)?\\.)+[a-zA-Z]{2,}$"

当前分支是maser分支，我想将stable分支上的代码完全覆盖brush分支，首先切换到brush分支。

git reset --hard origin/stable

检查元素是否在视窗内

// 计算两个时间搓的差时
function getInterval(start, end) {
           //两个日期对象，相差的毫秒数
           var interval = end - start;
           // 两个日期对象，相差的秒数
           // interval = interval / 1000;
           interval /= 1000;
           //求相差的天数/小时数/分钟数/秒数
           var day, hour, minute, second;
           day = Math.round(interval / 60 / 60 / 24);
           hour = Math.round(interval / 60 / 60 % 24);
           minute = Math.round(interval / 60 % 60);
           second = Math.round(interval % 60);
           return {
               day: day,
               hour: hour,
               minute: minute,
               second: second
           }
       }

//时间格式化
1.
var date= new Date(); //获取日期
var year=date.getFullYear(); //获取年份
var month=date.getMonth()+1; //获取月份
var day=date.getDate(); //获取天
var hour=date.getHours(); //获取时
var minute=date.getMinutes(); //获取分
var second=date.getSeconds(); //获取秒
var weekday=date.getDay(); //获取周
var week=new Array(7); //数组
week[0]=‘周日’;
 
2.
var unixTimestamp = new Date( 1477386005*1000 ) ;
commonTime = unixTimestamp.toLocaleString();
Date.prototype.toLocaleString = function() {
          return this.getFullYear() + "年" + (this.getMonth() + 1) + "月" + this.getDate() + "日 " + this.getHours() + "点" + this.getMinutes() + "分" + this.getSeconds() + "秒";
    };

console 的常用方法
1. 计算操作占用时长
console.time('timer');
console.timeEnd('timer');
2.console.table() 将数据以表格的形式显示
3.console.count() 此函数接受一个可选参数 label   // 输出被调用的次数

// 4位的随机数
function rid() {
  return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
}
// 再组合4个4位随机数
export function uuid() {
  return (tid() + "_" + rid() + "_" + rid() + "_" + rid())
}

    <script>
        sessionStorage.setItem('reload', 1)
        window.addEventListener('error', function (event) {
            try {
                const msg = event.message
                const unToken = /Unexpected token/.test(msg) && /</.test(msg) && /Uncaught SyntaxError/.test(msg)
                const chunkFailed = /ChunkLoadError/.test(msg) && /Loading chunk/.test(msg) && /failed/.test(msg)
                let firstReload = sessionStorage.getItem('reload')
                if ((chunkFailed || unToken) && (Number(firstReload) <= 5)) {
                    sessionStorage.setItem('reload', Number(firstReload) + 1)
                    window.location.reload()
                }
            } catch (err) {
                console.log('e', err)
            }
        })
    </script>