在寫頁面的過程中,header,footer等部分需要重復復用,比如導航欄等,這個時候如果我們將這些需要復用的部分寫進一個文件里邊,然后在需要的時候引用,那么自然事半功倍,
angularjs 或是jsp中都有很好的標簽用來引用外部文件,而html沒有,但是可以借助一些方式來進行引用。
[1 angularjs 文件引用]:
[頭部文件引用]
1 <head> 2 <% include configHead.ejs %> 3 <title>后台管理</title> 4 </head>
[尾部或中部文件引用]
1 <% include homeFooter.ejs %>
[jsp文件引用]
1 <%@ include file="文件名" %>//(等於是將兩個jsp合並為一個jsp)或 2 <jsp:include page="文件名">//(相當於將兩個jsp執行后的內容合並成一個頁面)
[2 html文件引用]:
[1] js方法,引入 homeHeader.html 和 homeFooter.html,div使用class引用
1 <script type="text/javascript"> 2 3 $(document).ready(function () { 4 5 $('.configHead').load('homeHeader.html'); 6 7 $('.configFoot').load('homeFooter.html'); 8 9 }); 10 11 </script> 12 13 </head> 14 15 <body> 16 17 <header> 18 19 <div class="configHead">
[2-iframe 引入]
1 <iframe name="" frameborder="0" scrolling="no" marginwidth="0" marginheight="0" width="100%" height="170" src="homeFooter.html"></iframe>
[3-css引入]
可以在css定義某個class,將所需要添加的東西負載上去,之后引用該class就可以了