.animate回调链中的重复行为

Question

当我想用.animate（）链接回调并想在其间放置一些代码时，那行代码不会只执行一次。在这种情况下，控制台打印字符串“text”的4倍。怎么会这样？

$("html, body").animate({ scrollTop: $(articles[index]).offset().top }, 500, function() {
  $("html, body").animate({ scrollTop: $(likeButton).offset().top - 500}, 1000, function(){
    console.log("text");
  });
});