通过JavaScript或jquery动态包含文件在HTML中

时间:2017-03-03 18:46:53

标签: javascript jquery html file include

我尝试了以下代码。但它没有正常工作。只有一个文件重复添加/包含。我怎么解决这个问题? **我想创建一个自定义标签""哪个可以包含h​​tml文件!!!! -



var createIncludeTag = document.createElement('include');
$(function(){
    var includeFile = $('include').attr('href');
    $("include").load(includeFile);		   
});

<include href="nav.html"></include>
<include href="main.html"></include>
<include href="footer.html"></include>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

<include>不是有效的html元素。

您可以使用设置为<link>的{​​{1}}属性的rel元素将资源加载到"import"。在document事件load元素,您可以使用<link>

获取资源内容
link.import

<link rel="import" href="nav.html" type="text/html">

   $(function() {
     $("body").append($("link[href='nav.html']")[0].import.body.innerHTML)
   })

或者,您可以使用 $("link[href='nav.html']").on("load", function() { $("body").append(this.import.body.innerHTML) })

.load()