滾動頁面的方法有scroll、scrollBy和scrollTo,三個方法都帶兩個參數:x(X軸上的偏移量)和y(Y軸上的偏移量)。因為是要滾動到頁面底部,所以參數x為0,y為頁面的滾動高度。另外,頁面的滾動高度必須在網頁加載完成後才能獲取到,所以觸發事件用onload。
具體步驟:
方法一:用scroll方法實現。
<body onload="scroll(0,document.body.scrollHeight) ">
<script>
document.write(new Array(100).join("<br>"))
</script>
方法二:用scrollBy方法實現。
<body onload="scrollBy(0,document.body.scrollHeight) ">
<script>
document.write(new Array(100).join("<br>"))
</script>
方法三:用scrollTo方法實現。
<body onload="scrollTo(0,document.body.scrollHeight)">
<script>
document.write(new Array(100).join("<br>"))
</script>
注意:因為頁面加載完後默認滾動在最頂端,所以在本例中用scroll、scrollBy和scrollTo方法的效果一樣,然而它們之間其實是有區別的。
特別提示
本例三種方法的代碼運行後,在頁面加載完成後將自動滾動到頁面最底端,效果如圖1.7.3所示。
圖1.7.3 加載完成後自動滾動到頁面底端的效果
特別說明
告訴讀者通過該問題的解決過程,需要掌握什麼內容或技巧,你能夠學到什麼,以及其他相關的知識點。
scroll 將窗口滾動到自左上角起指定的 x 和 y 偏移量。
scrollBy 將窗口滾動 x 和 y 偏移量。
scrollTo 將窗口滾動到指定的 x 和 y 偏移量。