前端知识点小记

作者: 轻丨尘 | 来源:发表于2018-11-05 16:37 被阅读0次

1.去除 webkit的滚动条
element::-webkit-scrollbar{display: none;}
如果要去除全部的，就把 element去掉同时这个属性可让在 div里的滚动如丝般顺滑： -webkit-overflow-scrolling : touch;

2.禁止用户选中文字 -webkit-user-select:none

3.使用 rem时，设某个 div比如的 height:3rem; line-height:1.5rem; overflow:hidden; 时，在某些 android手机上可能会出现显示不止两行,第三行会显示点头部。解决：利用 js获取文字 line-height再去设置 div高度

4.移动端字体使用 font-family:Helvetica,sans-serif; 这也是天猫使用的

5、日期格式化（年月日） new Date().toLocaleDateString()
6、常用正则表达式
function validRule(rule, value) {
let reg = null;
let txt = "格式不正确";
switch (rule) {
case 'tel': //匹配手机号
reg = /^[1][3,4,5,6,7,8,9][0-9]{9} $/g; txt = "手机号不正确"; break; case 'fixTel': // 国内电话 reg = /^(((0\d{3}[\-])?\d{7}|(0\d{3}[\-])?\d{8}|(0\d{2}[\-])?\d{7}|(0\d{2}[\-])?\d{8}))([\-]\d{2,4})?$ /;
break;
case 'identity': //匹配身份证
reg = /(^{\d{15}$)|(^\d{18}$)|(}\d{17}(\d|X|x) $)/; break; case 'num': //匹配非负整数 reg = /^\d*$ /;
break;
case 'integer': //匹配整数
reg = /^-?\d+ $/g; break; case 'floatNum': //匹配浮点数 reg = /^(-?\d+)(\.\d{1,2})?$ /;
break;
case 'floatPositiveNum': //匹配非负浮点数
reg = /^(\d+)(.\d{1,2})? $/; break; case 'name': //姓名 reg = /^[\u4E00-\u9FA5]{2,10}$ /;
txt = "限制2~10位汉字";
break;
case 'username': //会员昵称
reg = /^[\u4E00-\u9FA5A-Za-z0-9_]{2,10} $/; txt = "限制2~10位汉字、英语、数字或下划线"; break; case 'nickname': //名称，如活动名称 reg = /^([\u4E00-\u9FA5A-Za-z0-9]|_(?!_)){2,20}$ /; //2~20位名称
txt = "限制2~20位汉字、英语、数字或下划线";
break;
case 'commonname':
reg = /^[\u4E00-\u9FA5A-Za-z0-9]{1,6}$/; //级别称呼有用到
txt = "限制1~6位汉字、英语或数字";
break;
default:
break;
}
return {
valid: reg.test(value),
tip: txt
}
}