在HTML中的静态包含(HTML中提取公共代码HTML)

原创于 2017-10-21 10:51:36 发布 · 6.6k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#html静态包含html文件 #html

java 专栏收录该内容

69 篇文章

订阅专栏

本文介绍了一种在HTML页面(user_list.html)中通过Ajax技术动态加载公共头部(header.html)的方法，展示了具体的JavaScript代码实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

先拿我这个目录来说：要从user_list.html中提取出公共代码header.html。

但是问题是：要如何在user_list.html中引入header.html文件。

在user_list.html中提取的公共代码的位置，记录一个id.

<header class="header" id="header"></header>

然后利用js内部引用，和Ajax引用路径的方法。

<script type="text/javascript">
   /*引入Header部分公共代码*/
   $(function(){
      $.ajax({
         type:"get",
         url:"../common/header.html",
         async:true,
         success:function(data){
            $("#header").html(data);
         }
      });
   });