你要的Js工具函數(shù)【第二期】
防抖
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<input type="submit" value="send" onclick="send()">
</body>
<script>
function send() {
debounce(() => {
console.log('1')
}, 2000)()
}
const debounce = (fn, delay) => {
let timer = null;
return () => {
clearTimeout(timer);
timer = setTimeout(() => {
fn.apply(this)
}, delay)
}
}
</script>
</html>
時間轉化
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
<script type="text/javascript">
// 將秒化為時分秒
formateSeconds(endTime) {
let secondTime = parseInt(endTime); //將傳入的秒的值轉化為Number
let min = 0; // 初始化分
let h = 0; // 初始化小時
let result = "";
if (secondTime > 60) {
//如果秒數(shù)大于60,將秒數(shù)轉換成整數(shù)
min = parseInt(secondTime / 60); //獲取分鐘,除以60取整數(shù),得到整數(shù)分鐘
secondTime = parseInt(secondTime % 60); //獲取秒數(shù),秒數(shù)取佘,得到整數(shù)秒數(shù)
if (min > 60) {
//如果分鐘大于60,將分鐘轉換成小時
h = parseInt(min / 60); //獲取小時,獲取分鐘除以60,得到整數(shù)小時
min = parseInt(min % 60); //獲取小時后取佘的分,獲取分鐘除以60取佘的分
}
}
result = `${h.toString().padStart(2, "0")}:${min.toString().padStart(2, "0")}:${secondTime.toString().padStart(2, "0")}`;
return result;
},
// 將時分秒化為秒
formSeconds(times){
let arr = times.split(":");
let s = arr[2];
let m = arr[1];
let h = arr[0];
let m1 = m<10?m.replace(/\b(0+)/gi,""):m;
let h1 = h<10?h.replace(/\b(0+)/gi,""):h;
return m1*60+Number(h1)+Number(s)
},
</script>
</html>
簡易搜索
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<input type="text" id="int">
</body>
<script>
let list = ["示例1","示例12","示例5","示例56"];
document.querySelector('#int').onchange=function(e){
console.log(search(e.target.value));
}
function search(val) {
if (val) {
return list.filter(function (item) {
return Object.keys(item).some(function (key) {
return String(item[key]).toLowerCase().indexOf(val) > -1
})
})
}
return list
}
</script>
</html>
持續(xù)更新。。。
歡迎關注我的公眾號,回復關鍵詞【電子書】,即可獲取近十幾本前端熱門電子書。更有精品文章等著你哦。
你還可以加我微信,小弟拉攏了很多IT大佬,創(chuàng)建了一個技術交流、文章分享群,歡迎你的加入。
作者:Vam的金豆之路
主要領域:前端開發(fā)
我的微信:maomin9761
微信公眾號:前端歷劫之路