javascript - How to get the dom element at the top of the current page in js.

Question

Mainly I want to achieve an effect similar to the right navigation bar of Baidu Encyclopedia. As the page scrolls, the navigation bar on the right also changes. Thanks.

http://baike.baidu.com/item/G...

Answer 1

Listen to the window.onscroll event. When scrolling, dynamically determine the current scrolling distance. The code is roughly as follows:

window.onscroll = function(){
    var height = document.documentElement.scrollTop + document.body.scrollTop;
    if(height >= '目录锚点高度'){
        //TODO 给当前锚点加高亮class，并且去掉其他高亮的锚点的样式
    }
}

Answer 2

I don’t know if this is a similar effect you want? A small demo written by myself

    https://jsfiddle.net/f59e8enj/