单击锚定链接时应用平滑滚动（纯Javascript）

我正在编写代码，当单击锚链接时，直接跳转到页面中的特定部分

在这里，我想确保页面根据通过锚链接单击的特定部分平滑地向上或向下滚动

虽然有很多关于堆栈溢出的答案讨论了相同的问题，但我只想通过编写自己的代码来测试我的技能

我终于注意到我的代码不起作用了，它抛出了许多错误

我希望有一个更好的解决方案来改进我的代码

任何帮助都将不胜感激

函数smoothScroll（）{
设x=document.querySelectorAll（'a[href*=“#”]”）；
for（设i=0；i
.nav{
位置：相对位置；
宽度：100%；
高度：60px；
背景色：#111；
}

平滑卷轴
Lorem Ipsum只是
印刷和排版业。
Lorem Ipsum一直是该行业的佼佼者
16世纪以来的标准虚拟文本，
当一个不知名的印刷商在厨房里
类型，并将其拼凑成一个
打印样本簿。
它不仅存活了五个世纪，
而且是向电子排版的飞跃，
基本保持不变。
它在20世纪60年代流行起来
随着Letraset表的发布
包含Lorem Ipsum段，
最近的桌面
像Aldus这样的发布软件
PageMaker包括Lorem Ipsum的版本。
它来自哪里？
与人们的普遍看法相反，
Lorem Ipsum不是简单的随机文本。
它起源于一段古典音乐
公元前45年的拉丁文学，
使它有2000多年的历史。
要修复错误，问题在于
滚动视图的元素引用

您提供的
hash
值作为元素引用，这是不正确的。在使用哈希值选择元素后，需要传递该元素

let target=document.querySelector（this.hash）
target.scrollIntoView（）

.nav{
位置：相对位置；
宽度：100%；
高度：60px；
背景色：#111；
}

平滑卷轴
Lorem Ipsum只是
印刷和排版业。
Lorem Ipsum一直是该行业的佼佼者
16世纪以来的标准虚拟文本，
当一个不知名的印刷商在厨房里
类型，并将其拼凑成一个
打印样本簿。
它不仅存活了五个世纪，
而且是向电子排版的飞跃，
基本保持不变。
它在20世纪60年代流行起来
随着Letraset表的发布
包含Lorem Ipsum段，
最近的桌面
像Aldus这样的发布软件
PageMaker包括Lorem Ipsum的版本。
它来自哪里？
与人们的普遍看法相反，
Lorem Ipsum不是简单的随机文本。
它起源于一段古典音乐
公元前45年的拉丁文学，
使它有2000多年的历史。

函数smoothScroll（）{
设x=document.querySelectorAll（'a[href*=“#”]”）；
for（设i=0；i
.nav{
位置：相对位置；
宽度：100%；
高度：60px；
背景色：#111；
}

平滑卷轴
Lorem Ipsum只是
印刷和排版业。
Lorem Ipsum一直是该行业的佼佼者
16世纪以来的标准虚拟文本，
当一个不知名的印刷商在厨房里
类型，并将其拼凑成一个
打印样本簿。
它不仅存活了五个世纪，
而且是向电子排版的飞跃，
基本保持不变。
它在20世纪60年代流行起来
随着Letraset表的发布
包含Lorem Ipsum段，
最近的桌面
像Aldus这样的发布软件
PageMaker包括Lorem Ipsum的版本。
它来自哪里？
与人们的普遍看法相反，
Lorem Ipsum不是简单的随机文本。
它起源于一段古典音乐
公元前45年的拉丁文学，
使它有2000多年的历史。
这不是重复的。OP有一个具体的方法，并没有寻找不同的方法来实现这一点。只是想用适当的理由修复错误，如果可能的话，改进它。上面的方法不起作用吗？它应该可以工作，并用您的代码进行测试。不过，没有改进的余地。您的代码很好。@对不起，请现在检查。问题也在于我这边的元素引用。我已经编辑了我的答案。您也可以运行代码片段并进行测试。@ashish.me-yah现在可以运行了，谢谢兄弟！！！它是跨浏览器吗？@JustinWilliam是的，它是。我已附加参考链接。我们如何删除并保留何时将此脚本用于我上面的代码？？if（location.pathname.replace（/^\/，''）==this.pathname.replace（/^\/，''）和&location.hostname==this.hostname）如果（location.pathname.replace（/^\/，''）和&location.hostname==this.hostname），此行的角色是什么
@JustinWilliam如您在评论中所述？@sazzad location.pathname或window.location.pathname返回webh的域名
function smoothScroll(){
    let x = document.querySelectorAll('a[href*="#"]');
    for(let i = 0; i < x.length ; i++){
      x[i].onclick=function(){
      let target = document.querySelector(this.hash);
      target.scrollIntoView({
      behavior:'smooth',
      alignToTop:true,
      block:'start'
          });
         }
       }
    }
    smoothScroll();