原生HTML中通過-JS-引入公共模塊--組件化(header,footer,menu等)

1、html中通過id定義組件及引入

<!--header section -->
 <!-- 通過id注入組件 -->
<div id="header_page"></div>

<script>
// 通過load加載組件
$("#header_page").load("htmls/components/header.html", function(result) {
  });
</script>

 

2.header.html文件

<div class="headPage">
header組件
</div>
<script type="text/javascript">
$(function(){
   // 關於組件中使用的相關方法
});
</script>

 注意：在header.html文件中並非是標准的html文檔格式，只需相應標簽即可