JS 函数防抖示例

王世诣

于 2023-10-17 13:32:43 发布

阅读量88

点赞数

文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/CSDNwangyi/article/details/133881832

版权

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>防抖函数示例</title> 
<div style="width: 400px;height: 400px;background-color: red;font-size: 30px; text-align: center; line-height: 200px;"></div>
</head>
<body>

<script>

const debounce=function(fn, delay){
	let timer = null;
	return function(){
		if(timer){
			clearTimeout(timer);
		}
		timer = setTimeout(()=>{
			fn.apply(this, arguments);
		}, delay)
	}
}
const test = function(name) {
 let count = 0;
 return debounce(function () {
		document.querySelector('div').innerHTML = count ++;
 }, 400)
}


document.querySelector('div').addEventListener('mousemove', test('张三'))

</script> 

</body>
</html>