HTML引用公共组件在test.html引用footer.test.<script src="https://cdn.s

在test.html引用footer.html
效果图
在这里插入图片描述
代码

test.html

<!DOCTYPE html>
<html>
 
	<head>
		<meta charset="utf-8">
		<title>引用demo</title>
		<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
	</head>
 
	<body>
		<div id="app">
			我是頁面
		</div>
 
		<!-- 底部 -->
		<div class="footer">
		</div>
 
		<!-- 引入头部和底部的代码 -->
		<script type="text/javascript">
			$(".footer").load('footer.html');
			$.nicenav(300, '216px');
		</script>
	</body>
 
</html>

footer.html

<div class="footerTop">
			<dd>深圳某某软件科技有限公司</dd>
	<div class="footerTopRight">
		<ul>
			<li><img src="https://avatar.csdn.net/5/5/7/3_qq_42363090.jpg" alt=""><span>****小程序</span></li>
			<li><img src="https://avatar.csdn.net/5/5/7/3_qq_42363090.jpg" alt=""><span>***公众号</span></li>
		</ul>
	</div>
</div>