如何判断页面出现滚动条

Question

function isScrollY() {

    return document.documentElement.offsetHeight > document.documentElement.clientHeight;

}

这是判断页面出现纵向滚动条的方法。

问题1

document.body.clientHeight和document.documentElement.clientHeight有什么区别？

但是用在width上有问题，两个完全一样

function isScrollX() {

    return document.documentElement.offsetWidth > document.documentElement.clientWidth;

}

问题2

怎么判断页面是否出现横向滚动条？

Answer 1

html的clientHeight/Width是会随着窗口大小而改变的，这个属性值是可见宽高，body的clientHeight/Widht是元素宽高，不随窗口改变而改变，所以如果你通过body来判断，那是判断不出来的横向滚动条offsetWidth和clientWidth可以，你说完全一样是因为你压根没有滚动条吧，随便在segmentfault页面加个overflow和width都能看到offsetWidth和clientWidth是不同的