代码说明 Scrolltop

Question

有人可以解释一下这段代码的作用吗？比如“拆分”功能等。

$("button").click(function() {
    var id=this.id.split('[');
    var d_id=id[1].split(']')
    var ii=d_id[0]
    $('html, body').animate({
        scrollTop: $('[id='+ii+']').offset().top
    }, 2000);
});

Answer 1

1. 它为每个<button> 标签附加一个点击事件处理程序。
2. 在处理程序中，它会从按钮的 id 属性中提取“foo”，例如“bar[foo]”。
3. 它使页面滚动到具有“foo”id（“[id=...]”jQuery 选择器）的元素的位置。

string.split 是一个字符串函数，它根据给定的分隔符将字符串拆分为一个数组，这里是“[”，然后是“]”，检查 documentation。

简单地说，offset() jQuery 函数返回给定选择器匹配的第一个元素的顶部和左侧像素坐标，检查 documentation。

因此，当您单击 id 为“bar[foo]”的<button> 时，页面将进行动画垂直滚动，以便 id 为“foo”的元素将位于顶部或窗口。