js:
// 1.类型检测类
//字符串
function isString(o){
return Object.prototype.toString.call(o).slice(8,-1) === 'String'
}
//数字
function isNumber(o){
return Object.prototype.toString.call(o).slice(8,-1) === 'Number'
}
//对象
function isObject(o){
return Object.prototype.toString.call(o).slice(8,-1) === 'Object'
}
//数组
function isArray(o){
return Object.prototype.toString.call(o),sllice(8,-1) === 'Array'
}
//手机类型
function mobileType(){
let u = navigator.userAgent;
if(u.indexOf('Android') > -1 || u.indexOf('Linux' > -1)){
return 'Android'
}
else if(u.indexOf('iPhone') > -1){
return 'iPhone'
}
else if(u.indexOf('iPad') > -1){
return 'iPad'
}
}
//字符串检测
function strCheck(str,type){
switch(type){
case 'phone'://手机号
return /^1[3|4|5|6|7|8|][0-9]{9}$/.test(str);
case 'tel'://座机
return /^(0\d{2,3}-\d{7,8})(-\d{1,4})?$/.test(str);
case 'card'://身份证
return /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(str);
case 'pwd':
return /^[a-zA-z]\w{5,17}$/.test(str);
case 'email':
return /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/.test(str);
case 'number':
return /^[0-9]{6}$/.test(str)
}
}
//日期类
//格式化
function timeFormat(obj){
let temDate = obj.date || new Date(),format = obj.format || "-";
// let y = temDate.getFullYear(),
// m = temDate.getMonth() + 1 > 9 ? temDate.getMonth() + 1 : '0' + temDate.getMonth() + 1,
// d = temDate.getDate() > 9 ? temDate.getDate() : '0' + temDate.getDate(),
// h = temDate.getHours() > 9 ? temDate.getHours() : '0' + temDate.getHours(),
// mi = temDate.getMinutes > 0 ? temDate.getMinutes : '0' + temDate.getMinutes,
// s = temDate.getSeconds() > 9 ? temDate.getSeconds() : '0' + temDate.getSeconds();
let y = temDate.getFullYear(),
m = compareNine(temDate.getMonth() + 1),
d = compareNine(temDate.getDate()),
h = compareNine(temDate.getHours()),
mi = compareNine(temDate.getMinutes()),
s = compareNine(temDate.getSeconds());
return y + format + m + format + d + " " + h + ":" + mi + ":" + s
}
function compareNine(val){
return val > 9 ? val : '0' + val
}
//日期比较大小
function timeCompare(one,two){
let oneDate = new Date(Date.parse(one));
let twoDate = new Date(Date.parse(two));
return oneDate<twoDate
}
//一周以前
function beforeWeekDate(date,format){
let temDate = date || new Date();
if(!(temDate instanceof Date)){
temDate = new Date(temDate.replace(/-/g, '/'));
}
let temDateTime = temDate.getTime(),
weekDate = new Date(temDateTime - 7*24*60*60*1000);
return timeFormat(weekDate,format)
}
//数组类
//判断一个元素是否在数组内
function contains(str,arr){
return arr.indexOf(str) > -1
}
//封装map
function myMap(arr,fn,thisObj){
let scope = thisObj || window,
returnArray = [];
for(let i=0,j=arr.length;i<j;i++){
let res = fn.call(scope,arr[i],i,this);
if(res != null){
returnArray.push(res)
}
}
return returnArray;
}
//封装 each
function myEach(arr,fn){
let returnArray = [],_fn = fn || Function;
let args = Array.prototype.slice.call(arguments,1);
for(let i=0,j=arr.length;i<j;i++){
let res = fn.apply(arr,[arr[i],i].concat(args))
if(res != null){
returnArray.push(res)
}
}
}
//排序 1 升序 2 降序 3 随机 4 自己
function mySort(arr,type){
let arrLen = arr.length;
if(arrLen === 0 || arrLen === 1){
return arr;
}
return arr.sort(function(a,b){
switch(type){
case 1:
return a - b;
case 2:
return b - a;
case 3:
return Math.random() - 0.5;
default:
return arr
}
})
}
//去重
function myUinique(arr){
if(Array.hasOwnProperty('from')){
return Array.from(new Set(arr))
}
else{
let a = [],o = {};
for(let i=0,j=arr.length;i<j;i++){
if(!o[arr[i]]){
o[arr[i]] = true;
a.push(arr[i])
}
}
return a
}
}
//最大值
function myMax(arr){
return Math.max.apply(null,arr)
}
//最小值
function myMin(arr){
return Math.min.apply(null,arr)
}
//类数组 -> 数组
function arrLikeToArr(arrLike){
let arr = [];
if(Array.isArray(arrLike)){
arr = arrLike
}
else{
arr = Array.prototype.slice.call(arrLike)
}
return arr;
}
//string类
//去空格 1 所有 2 前后 3 前 4 后
function myTrim(str,tp){
let type = tp || 1;
switch(type){
case 1:
return str.replace(/s+/g,'')
case 2:
return str.replace(/(^\s*)|(\s*$)/g,'')
case 3:
return str.replace(/(^\s*)/g,'')
case 4:
return str.replace(/(\s*$)/g,'')
}
}
//大小写变化 1:首字母大写 2:首页母小写 3:大小写转换 4:全部大写 5:全部小写
function changeCase(str,tp){
let type = tp || 1;
switch(type){
case 1:
return str.replace(/\b\w+\b/g,function(word){
return word.substring(0,1).toUpperCase() + word.substring(1).toLowerCase()
})
case 2:
return str.replace(/\b\w+\b/g/g,function(word){
return word.substring(0,1).toLowerCase() + word.substring(1).toUpperCase()
})
case 3:
return str.split('').map(function(word){
if(/[a-z]/.test(word)){
return word.toUpperCase()
}
else{
return word.toLowerCase()
}
}).join('');
case 4:
return str.toUpperCase();
case 5:
return str.toLowerCase();
}
}
//密码强度
function pwdCheck(str){
let LV = 0;
if(str.length < 6){
return Lv;
}
if(/[0,9]/.test(str)){
return LV++
}
if(/[a-z]/.test(str)){
return LV++
}
if(/[A-Z]/.test(str)){
return LV++
}
if(/[\.|-|_]/.test(str)){
return LV++
}
return LV++
}
//number类
//随机数
function randomNumber(min,max){
if(arguments.length === 2){
return Math.floor(min + Math.random() * (max + 1 - min))
}
else{
return null
}
}
//补零 position:1 前 2 后 _length 返回的数据长度
function addZero(param,_length,position){
let len = param + "",
dataArr = len.split(""),
lenHandle = dataArr.length,
num = _length - lenHandle;
if(num<0){
return param;
}
for (let i = 0; i < num; i++) {
if(position === 1){
dataArr.unshift("0")
}
else if(position === 2){
dataArr.push("0")
}
}
let nowData = dataArr.join("");
return nowData;
}
//存储类
function setSession(name,val){
return sessionStorage.setItem(name,val)
}
function getSession(name){
return sessionStorage.getItem(name)
}
function setCookie(name,val,time){
let setting = arguments[0];
if(Object.prototype.toString.call(setting).slice(8,-1) === 'Object'){
for(let i in setting){
let oDate = new Date();
oDate.setDate(oDate.getDate() + time);
document.cookie = name + '=' + val + ';expires=' + oDate;
}
}
else{
let oDate = new Date();
oDate.setDate(oDate.getDate() + time);
document.cookie = name + '=' + val + ';expires=' + oDate;
}
}
function getCookie(name){
let arr = document.cookie.split(';');
for(let i=0,j=arr.length;i<j;i++){
let arr2 = arr[i].split('=');
if(arr2[0] === name ){
return arr2[1]
}
}
}
//防抖
//节流
//监听input框
//倒计时
//事件绑定,监听,解绑
//事件冒泡 阻止冒泡 阻止默认行为
css
*{
padding:0;
margin:0
}
html,body{
-webkit-text-size-adjust: 100%;
width: 100%;
height: 100%;
font-family: "微软雅黑"
}
acticle,aside,footer,header,nav,section{
display: block
}
ul,li{
list-style: none;
}
a{
text-decoration: none
}
button,
input,
optgroup,
select,
textarea {
font-family: sans-serif;
/* 1 */
font-size: 100%;
/* 1 */
line-height: 1.15;
/* 1 */
margin: 0;
/* 2 */
}
/* 禁止文本选中 */
.usn{
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
-o-user-select:none;
user-select:none;
}
textarea {
overflow: auto;
}
.box-sizing-border{
box-sizing: border-box
}
.box-sizing-content{
box-sizing: content-box
}
.display-block{
display: block
}
.display-inline{
display: inline;
}
.display-inline-block{
display:inline-block
}
.display-flex{
display:flex;
}
.shadow-5-111{
box-shadow:0 0 5px #111;
}
.shadow-10-111{
box-shadow:0 0 10px #111;
}
.shadow-5-eee{
box-shadow:0 0 5px #eee;
}
.shadow-10-eee{
box-shadow:0 0 10px #eee;
}
/* 内容居中 */
.content-center{
display:flex;
justify-content: center;
align-items:center
}
/* 三角形 一边颜色 其余三边 transparent*/
.triangle{
width:0;
height:0;
border-style:solid;
border-width: 20px;
border-color: red yellow green lightblue
}
.fz-12{
font-size: 12px;
}
.fz-14{
font-size: 14px;
}
.fz-16{
font-size: 16px;
}
.color-red{
color:red;
}
.color-green{
color:green;
}
.color-white{
color:white;
}
.color-black{
color:black
}
.color-blue{
color:blue
}
.color-gray{
color:gray;
}
.bg-eee{
background:#eee;
}
.bg-111{
background:#111;
}
.bg-fff{
background: #fff;
}
.margin-10{
margin:10px
}
.margin-20{
margin:20px
}
.margin-30{
margin:30px;
}
.margin-40{
margin:40px;
}
.padding-10{
padding:10px
}
.padding-20{
padding:20px
}
.padding-30{
padding:30px;
}
.padding-40{
padding:40px;
}
.input-36{
width:100%;
height:38px
}
.input-20{
width:100%;
height:20px
}
.div-20{
height: calc( 100vh - 20px);
}
.div-40{
height: calc( 100vh - 40px);
}
.div-100{
height: calc( 100vh - 100px);
}
.div-200{
height: calc( 100vh - 200px);
}
/* 定位 */
.position-fixed{
position:fixed
}
.position-absolute{
position:absolute
}
.position-relative{
position: relative;
}
/* 浮动 */
.fl{
float: left;
}
.fr{
float:right;
}
/* 清除浮动 */
.clear-fix:after {
content:"";
display:block;
height:0;
clear:both;
visibility:hidden;
}
/* input 为number 隐藏 后面的图标 */
input[type=number] {
-moz-appearance:textfield;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
/* placeholder */
input::-webkit-input-placeholder{
color:#c0c3cc;
}
input::-moz-placeholder{
color:#c0c3cc;
}
input:-ms-input-placeholder{
color:#c0c3cc;
}
/* input 为pwd ie去除图标 */
::-ms-clear,::-ms-reveal{display:none;}
/* loading层 */
.cover{
position:fixed;
height: 100%;
width:100%;
top:0;
left:0;
display: flex;
justify-content: center;
align-items: center;
}
/* 换行 */
/* 不换行 */
.word-none{
word-wrap: normal;
word-wrap: nowrap;
}
/* 换行 */
.word-break{
white-space: normal;
word-wrap: break-word;
word-break: break-all
}
/* 多余超出省略号 宽度自定义*/
.wote{
max-width: 100px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/* 鼠标样式 */
.cursor-pointer{
cursor:pointer
}
.cursor-help{
cursor:help
}
.cursor-default{
cursor:default
}
.cursor-move{
cursor:move
}
/*默认滚动条样式修改ie9 google Firefox 等高版本浏览器有效*/
/*::selection {background: #D03333;color: white;text-shadow: none;}
::-webkit-scrollbar-track-piece{width:10px;font-style: italic;">::-webkit-scrollbar{width:10px;height:6px}
::-webkit-scrollbar-thumb{height:50px;}
::-webkit-scrollbar-thumb:hover{background:#cc0000}*/