使用JavaScript 在多個HTML 頁面中包含公共頁眉和頁腳檔案
在Web 開發中，通常需要包含公共元素，例如頁首和頁腳，跨多個HTML 頁面以保持一致性和組織。這可以透過使用 JavaScript 來實現。
使用 jQuery 進行頁首和頁腳包含
包含常見頁首和頁尾檔案的一種方法是透過 jQuery。此 JavaScript 程式庫提供了一種簡單有效的方法將外部內容載入到網頁中。
建立HTML 檔案
對於這種方法，您將需要建立三個HTML 檔案：
index.html程式碼
<html>
<head>
<title></title>
<script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>
<script>
$(function() {
$("#header").load("header.html");
$("#footer").load("footer.html");
});
</script>
</head>
<body>
<div>header.html 與 footer.html程式碼
<!-- header.html --> <a href="http://www.google.com">Click here for Google</a>
<!-- footer.html --> <p>Copyright © 2023</p>
載入頁眉和頁腳
建立HTML 檔案後，jQuery 的load()方法用於將header. html和footer.html的內容分別非同步載入到index.html中的#header和#footer元素中。
當使用者存取index.html時，頁首和頁尾都會被載入內容將呈現在頁面上，從而在多個頁面上提供一致且有凝聚力的使用者體驗。
以上是如何使用 JavaScript 在多個 HTML 頁面中包含通用頁首和頁尾？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
