这是一个 HTML 页面，在左上角显示三个方形 div：
window.addEventListener('load', function () {
console.log('load event has fired')
window.scrollTo(500, 0);
// setTimeout(function() { window.scrollTo(500, 0); }, 0);
})
body { height: 100vh }
.bigwidth {
width: 2000px;
display: block;
}
.square {
width: 100px;
height: 100px;
display: block;
position: absolute;
}
.greenish {
background-color: #75af99;
}
.redish {
background-color: #ff9b98;
}
.bluish {
background-color: #aabbff;
}
.whiteish {
background-color: #eaeaea;
}
* {
padding: 0;
margin: 0;
}
<div class="whiteish bigwidth" style="height:100%;">
<div class="square greenish" style="left:50px; top:50px;"></div>
<div class="square redish" style="left:70px; top:70px;"></div>
<div class="square bluish" style="left:90px; top:90px;"></div>
</div>
现在的window.scrollTo(500, 0);页面加载时发生的命令无效（在 safari 和 Chrome 中测试）。但如果我们用行替换它
setTimeout(function() { window.scrollTo(500, 0); }, 0);
（在上面的代码中注释掉），滚动确实发生了。为什么是这样？
None
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
