javascript - 滚动到 Facebook 消息的顶部

Question

我可以执行一些 JavaScript 代码来滚动到 Facebook 消息框的顶部吗？因此，当您单击“查看全部”并转到主消息页面时，如果您向上滚动它会加载更多消息。我想强制它继续向上滚动以继续加载消息。我试过了

document.body.scrollTop = document.documentElement.scrollTop = 0;

但这当然只会滚动到实际页面的顶部。关于如何向上滚动消息框的任何想法？

Answer 1

选择一个对话并尝试这个脚本(通过控制台加载它):

var autoLoad = {

    messagesContainer: document.querySelector('#contentArea [role=main] .uiScrollableAreaContent'),

    start: function (speed) {
        var messagesContainer = this.messagesContainer,
            loadMore = document.querySelector('[role=log] .pam.uiBoxLightblue.uiMorePagerPrimary');
        speed = parseInt(speed, 10) || 1000;
        clearInterval(this.interval);
        this.interval = setInterval(function () {
            messagesContainer.style.top = '0px';
            loadMore.click();
        }, speed);
    },

    stop: function () {
        clearInterval(this.interval);
        this.messagesContainer.style.top = '';
    }

};

要启动它，请键入:

// Takes a 'speed' parameter, defaults to 1000 milliseconds
autoLoad.start(1200);

并停止它(滚动条重新出现所必需的):

autoLoad.stop();

解释:

在研究了 Facebook 的 DOM 之后，我发现了一些选择器专门针对实现此功能所需的元素:

• 消息容器，保存消息
• “加载更多”链接，触发 facebook 负责加载更多消息的脚本。

消息容器可滚动区域不使用原生滚动，而是使用 bottom 和 top 设置其当前滚动位置。

所以，如果你想滚动到顶部，你将容器设置为 top: '0'，因为这样，消息自动加载 AJAX 只触发一次，你需要每次滚动到顶部后手动触发它。我设法通过在触发 AJAX 的链接中执行 click 来做到这一点。

我尝试获取我能找到的最具体的类/选择器，以及那些听起来更笼统的类/选择器，因为我不知道 Facebook 是否以某种方式动态生成 ID/类。

我在 Firefox 和 Chrome 下对此进行了测试，对代码进行了一些研究并对其进行了更改以满足您的需求。我希望这对您有用，否则，您可以使用 DOM 资源管理器找到合适的选择器。