html 锚点平滑滚动到目标位置

在使用html锚点的时候，想要使得点击后平滑的滚动到目标位置，而不是直接跳转过去，可以使用一下代码

// 获取所有的锚点链接元素
const anchorLinks = document.querySelectorAll('a[href^="#"]');

// 给每个锚点链接添加点击事件处理程序
anchorLinks.forEach(link => {
	link.addEventListener('click', e => {
		e.preventDefault(); // 阻止默认的锚点跳转行为

		// 获取目标元素的ID
		const targetId = link.getAttribute('href');
		console.log(targetId)

		// 获取目标元素
		const targetElement = document.querySelector(targetId);

		// 使用scrollIntoView方法实现平滑滚动效果
		targetElement.scrollIntoView({
			behavior: 'smooth',
			block: 'start' // 滚动到目标元素顶部
		});
	});
});

这段代码要放在body的后面，否则找不到元素