一、原生js防抖
<!DOCTYPE html>
<html>
<head><title>防抖按钮示例</title>
</head>
<body><button id="immediateButton">立即触发</button><button id="waitButton">等候触发</button><script>function debounceImmediate(func, delay) {let timeoutId;let immediate = true;return function (...args) {clearTimeout(timeoutId);if (immediate) {func.apply(this, args);immediate = false;}timeoutId = setTimeout(() => {immediate = true;}, delay);};}function debounceWait(func, delay) {let timeoutId;return function (...args) {clearTimeout(timeoutId);timeoutId = setTimeout(() => {func.apply(this, args);}, delay);};}function handleImmediateClick() {console.log('立即触发按钮点击事件处理函数');}function handleWaitClick() {console.log('等候触发按钮点击事件处理函数');}const debouncedImmediateClick = debounceImmediate(handleImmediateClick, 1000); const debouncedWaitClick = debounceWait(handleWaitClick, 1000); const immediateButton = document.getElementById('immediateButton');immediateButton.addEventListener('click', debouncedImmediateClick);const waitButton = document.getElementById('waitButton');waitButton.addEventListener('click', debouncedWaitClick);</script></body>
</html>
