脚本类型=“文本/ html"从文件中包含HTML

script type="text/html" include HTML from a file

本文关键字:文件 HTML 包含 quot 类型 文本 html 脚本      更新时间:2023-09-26

我有一个<script type="text/html">如下:

<script type="text/html" id="id">
        // I want to import HTML from a file here
</script>

请建议<object>, <iframe> and <embed>以外的解决方案这些标签会把我的CSS弄得一团糟,因为它们会插入自己的HTML、BODY和其他元素。

我宁愿不使用jQuery。虽然没有那么坚决。

编辑:

script type="text/html"是必须的,因为我使用模板在页面之间路由。模板由script type="text/html"元素的"id"标识。

如果您确实考虑使用jQuery, .load()将会奏效:

$( "#id" ).load( "path/to/file.html" );

<一口> JSFiddle插图

如果您的文件在同一域中,我建议您使用ajax来恢复它。这样的:

<div id="wrapper"></div>
<script type="text/javascript">
    var remote_html_container = jQuery("#wrapper");
    jQuery.ajax({
      url: "my-page-url",
      success: function(data){
        remote_html_container.html(data);
      }
    });
</script>

它的作用是通过jQuery加载页面的输出并将其"粘贴"到div#包装器中。

编辑:使用load函数就简单多了:

<div id="wrapper"></div>
<script type="text/javascript">
  jQuery("#wrapper").load("my-url.html");
</script>