在HTML中,可以使用標籤來實現頁面跳轉,但是如何透過按鈕實現頁面跳轉呢?這就需要用到HTML中的
用HTML Button實作頁面跳轉需要在
其中,window.location.href是JavaScript程式碼的一部分,表示跳轉的頁面URL位址。
下面是一個HTML Button實作頁面跳轉的範例程式碼:
<title>HTML Button跳转页面</title>
<button onclick="window.location.href='https://www.baidu.com/'">前往百度</button>
#< /html>
在上述程式碼中,當點擊「前往百度」按鈕時,會跳到百度的官方網站。
在實際開發中,經常需要跳到同一網站內的其他頁面,這時可以使用相對路徑,而不是完整的URL位址。範例程式碼如下:
<title>HTML Button跳转页面</title>
<button onclick="window.location.href='about.html'">关于我们</button>
<title>HTML Button跳转页面</title>
除了直接在onclick屬性中寫入JavaScript程式碼實現頁面跳轉,還可以透過一個函數來實現頁面跳轉。範例程式碼如下:
<button onclick="goToPage()">跳转页面</button> <script type="text/javascript"> function goToPage() { window.location.href = "https://www.baidu.com/"; } </script>##
<title>HTML Button跳转页面</title>
<button onclick="window.history.back()">返回</button> <button onclick="window.location.reload()">刷新</button>
除了跳到其他頁面,HTML Button還可以實現後退與刷新操作。範例程式碼如下:
rrreee
rrreee
#########在上述程式碼中,當點擊“返回”按鈕時,會回到前一頁,而點擊“刷新”按鈕則會重新整理目前頁面。 ######總之,HTML Button是實現頁面跳躍、後退、刷新等功能的重要元素之一。透過掌握HTML Button的基本語法與相關知識,便可輕鬆實現各種操作,為Web開發提供便利的工具。 ###以上是實例講解怎麼用html實作點擊Button元素跳轉頁面的詳細內容。更多資訊請關注PHP中文網其他相關文章!