Javascript 滚动到页面顶部

我有一个类似以下代码的页面：

---

var btn=document.getElementById（'test'））
test.addEventListener（“单击”，函数（）{
窗口。滚动（0,0）
})

.wrap{
溢出y：滚动；
位置：绝对位置；
左：0；
顶部：0px；
右：0；
底部：0；
}
.集装箱{
高度：1280px
}
钮扣{
边缘顶部：500px；
}

Lorem ipsum dolor sit amet，是一位杰出的献身者。在马萨和鲁特鲁姆举行的会议上。在枕叶无褶层，矢状舌骨nec，厚舌骨。这是一种很好的选择。猫科动物Proin nibh felis，vulputate eget vehicula et，viverra et sem。埃尼亚欧那猫咪是欧洲最大的动物。不可能是一个普通的智者。前矢状体、帆状体、盾状体。埃尼安水平扫描电镜。整数id tellus nisl。不可在任何地方使用，ac sagittis sem eleifend non。这是一个很好的例子，它是一个威尼斯人的聚会，是一个充满爱欲的苏打水的聚会，是一个充满活力的聚会。前庭是一个公共门。在莫里斯和利奥·苏西比特的对决，波苏尔·努拉·埃吉特，特里斯蒂克·尼西。根据康努比亚·诺斯特拉（conubia nostra）和希梅纳奥斯（inceptos himenaeos）的规定，社会责任和责任等级为：。Nunc finibus commodo nisl，在中添加了aliquam odio调味品。
毛里斯·丁奇登·内克·奎斯是孕妇。普罗宁，罗丹明，非土耳其人。马库拉比图尔皮斯酒店。拉奥里特河畔的中间悬钩子。在酵母菌前庭中，我们可以看到一个巨大的边缘。车辆性湿疣。虎口浮雕和肘部浮雕同侧前庭；在一个充满活力的世界里。大酒后驾车。Morbi placerat turpis id sollicitudin mattis。
直径为枕径的前叶蝉。绿背飞虱。我们的时间就在这里。nisi aliquam facilisis的Sed euismod。Nam eleifend和Pat lacus eu ornare。这是一种发酵剂，用于制作威尼斯权杖饼。比勒陀利亚万岁，只是封建权杖，威尼斯圣火之角，不必为精英和酒后驾车而战。这是一个很好的例子。前庭直径为非viverra posuere。Nam ex sem、Comodo Volatip sodales vel、euismod id sem。
这是一个很好的例子。无胎盘大鼠胚胎扫描电镜。无秃鹫的地方直径，坐着一只秃鹫。Present scelerisque是orci孕妇的变种。埃涅亚非大地扁桃体，先兆，半毫米直径。非选举的生活是一个充满变化的世界。苏打菜。Aliquam et nisi a ipsum viverra mollis。这是一个很好的例子。孕妇的临终关怀。在hac habitasse Plateum，一句名言。这是一个天才。美塞纳调味品tellus tellus，eget pretium nulla lobortis consequat。Nam posuere malesuada dolor。
佩伦茨克人是智者，也是射手座的人。梅塞纳·埃吉特·洛雷姆（Maecenas eget lorem）在麦格纳（magna）的尼布·特里斯蒂克·尤伊斯莫·普雷蒂姆（nibh tristique euismod pretium）。不必担心。长尾草。塞德·瓦里乌斯·阿科索斯。无便利。佩伦特式非精英饮食。黄鳝（Nullam venenatis luctus tellus）。梅塞纳斯·塞德·莫莱斯蒂·里索斯（Maecenas sed molestie risus）。《真理经》中的奎斯克。
点击我到顶部

问题在于，您的内容设置了CSS

位置：绝对

集，它将内容放在自己的层中，与主文档分开。分层内容独立于主文档“流”滚动

您的HTML和JavaScript中还有一个额外的

，变量名为

btn

，但随后您在

测试中设置了事件

删除该指令并更正JavaScript变量，它就会工作


document.getElementById（'test'）.addEventListener（“单击”，函数（）{
窗口。滚动（0,0）；
})
.wrap{
左：0；
顶部：0px；
右：0；
底部：0；
}
.集装箱{
高度：1280px
}
钮扣{
边缘顶部：500px；
}

Lorem ipsum dolor sit amet，是一位杰出的献身者。在马萨和鲁特鲁姆举行的会议上。在枕叶无褶层，矢状舌骨nec，厚舌骨。这是一种很好的选择。猫科动物Proin nibh felis，vulputate eget vehicula et，viverra et sem。埃尼亚欧那猫咪是欧洲最大的动物。不可能是一个普通的智者。前矢状体、帆状体、盾状体。埃尼安水平扫描电镜。整数id tellus nisl。不可在任何地方使用，ac sagittis sem eleifend non。这是一个很好的例子，它是一个威尼斯人的聚会，是一个充满爱欲的苏打水的聚会，是一个充满活力的聚会。前庭是一个公共门。在莫里斯和利奥·苏西比特的对决，波苏尔·努拉·埃吉特，特里斯蒂克·尼西。根据康努比亚·诺斯特拉（conubia nostra）和希梅纳奥斯（inceptos himenaeos）的规定，社会责任和责任等级为：。Nunc finibus commodo nisl，在中添加了aliquam odio调味品。
毛里斯·丁奇登·内克·奎斯是孕妇。普罗宁，罗丹明，非土耳其人。马库拉比图尔皮斯酒店。拉奥里特河畔的中间悬钩子。在酵母菌前庭中，我们可以看到一个巨大的边缘。车辆性湿疣。虎口浮雕和肘部浮雕同侧前庭；在一个充满活力的世界里。大酒后驾车。Morbi placerat turpis id sollicitudin mattis。
直径为枕径的前叶蝉。绿背飞虱。我们的时间就在这里。nisi aliquam facilisis的Sed euismod。Nam eleifend和Pat lacus eu ornare。酒糟
<style>
.wrap {
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
}
.container {
    height: 1280px;
    overflow-y: scroll;
}
.scroll-top-btn {
    display: inline-block;
    margin: 40px 0;
    padding: 5px 15px;
    border: 1px solid #777;
    border-radius: 6px;
    text-decoration: none;
    color: #000;
}
</style>
<div class="wrap">
    <div class="container">
        <div id="myText">
            Start<br>Start<br>Start<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>
            abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>
            abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>
            abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>
            abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>
            abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>
            abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>
            abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>abcde<br>End<br>End<br>End<br>
        </div>
        <div>
            <a class="scroll-top-btn" href="#myText">Click me To Top</a>
        </div>
    </div>
</div>