前端script引入公共的代码

在做前端网页的时候，会涉及到很多界面，有的时候，这些界面都会有重复的代码，比如侧边栏菜单的重复代码，头部导航的 重复代码，底部的重复代码，这个时候，为了使每个页面的代码看起来简洁明了，我们需要把这些重复的代码放到公共的页面里面，在具体页面只需引用即可。

主要代码

<div id="head"></div>
<div id="side"></div>

 <script>
 $("#head").load("com/head.html");
 $("#side").load("com/side.html");
 </script>

1：在文件里面新建head.html和side.html

2：打开head.html，side.html类似
将头部重复的代码复制在head.html界面里面

head.html

 <div class="header-right">
							<div class="profile_details_left"><!--notifications of menu start -->
								<ul class="nofitications-dropdown">									
									<li class="dropdown head-dpdn">
										<a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><i class="fa fa-bell"></i><span class="badge blue">3</span></a>
										<ul class="dropdown-menu">											
											<li><a href="#">
												<div class="user_img"><img src="images/p5.png" alt=""></div>
											   <div class="notification_desc">
												<p>危险区域报警</p>												
												</div>
											  <div class="clearfix"></div>	
											 </a></li>
											 <li class="odd"><a href="#">
												<div class="user_img"><img src="images/p6.png" alt=""></div>
											   <div class="notification_desc">
												<p>滞留报警</p>												
												</div>
											   <div class="clearfix"></div>	
											 </a></li>
											 <li><a href="#">
												<div class="user_img"><img src="images/p7.png" alt=""></div>
											   <div class="notification_desc">
												<p&