html写官网之类,我们经常会有很多页面同一头部和尾部,我们把它们分离出来,组件引入
vue等框架类的就不说了,主要是说html原生态的
(如果是PHP文件可以直接include() 或 require() 函数引入html文件)
用到JQ里面的load方法
<body><div class="headerpage"></div><div></div><div class="footerpage"></div>
</body>
定义节点名,在此节点中引入相应版块
$(".headerpage").load("../header.html",()=>{$('.jingM').addClass('cdk');
});
$(".footerpage").load("../footer.html");
第一个参数是组件路径,第二个参数可以是引入完成是的回调函数
此时要注意一点
如果你头部尾部组件内有js逻辑,此逻辑需要写在相应的组件中
比如header.html
<div class='header'>header组件内容
</div>
<script>//header组件中的方法$('.goLoadApp').click(function () {Cookies.set('loadApp', 1);window.location.href = '../'})
</script>