我有2个HTML文件,假设a.html和b.html。在a.html中,我想包括b.html。
在JSF中,我可以这样做:
<ui:include src="b.xhtml" />
这意味着在.xhtml文件中,我可以包含b.xhtml。
我们如何在*.html文件中做到这一点?
我有2个HTML文件,假设a.html和b.html。在a.html中,我想包括b.html。
在JSF中,我可以这样做:
<ui:include src="b.xhtml" />
这意味着在.xhtml文件中,我可以包含b.xhtml。
我们如何在*.html文件中做到这一点?
当前回答
PHP是一种服务器级脚本语言。它可以做很多事情,但一个流行的用途是在页面中包含HTML文档,这与SSI非常相似。与SSI一样,这是一种服务器级技术。如果你不确定你的网站上是否有PHP功能,请联系你的主机提供商。
下面是一个简单的PHP脚本,你可以使用它在任何支持PHP的网页上包含HTML片段:
将网站常用元素的HTML保存到单独的文件中。例如,导航部分可以保存为navigation.html或navigation.php。 使用下面的PHP代码将该HTML包含在每个页面中。
<?php require($DOCUMENT_ROOT . "navigation.php"); ?>
在希望包含该文件的每个页面上使用相同的代码。 确保将突出显示的文件名更改为包含文件的名称和路径。
其他回答
作为一种替代方法,如果你可以访问服务器上的。htaccess文件,你可以添加一个简单的指令,允许php在以。html扩展名结尾的文件上被解释。
RemoveHandler .html
AddType application/x-httpd-php .php .html
现在你可以使用一个简单的php脚本来包含其他文件,比如:
<?php include('b.html'); ?>
一个非常老的解决方案满足了我当时的需求,但下面是如何做到标准兼容的代码:
<!--[if IE]>
<object classid="clsid:25336920-03F9-11CF-8FD0-00AA00686F13" data="some.html">
<p>backup content</p>
</object>
<![endif]-->
<!--[if !IE]> <-->
<object type="text/html" data="some.html">
<p>backup content</p>
</object>
<!--> <![endif]-->
你可以用JavaScript的jQuery库来实现这一点,就像这样:
HTML:
<div class="banner" title="banner.html"></div>
JS:
$(".banner").each(function(){
var inc=$(this);
$.get(inc.attr("title"), function(data){
inc.replaceWith(data);
});
});
请注意banner.html应该位于您的其他页面所在的相同域下,否则您的网页将拒绝banner.html文件,因为跨源资源共享政策。
另外,请注意,如果您使用JavaScript加载内容,谷歌将无法对其进行索引,因此对于SEO而言,这并不是一个好方法。
大多数解决方案的工作,但他们有jquery的问题:
问题出现在代码$(document)下面。ready(function () {alert($("#includedContent").text());}不提示任何内容,而不是提示包含的内容。
我写下面的代码,在我的解决方案中,你可以访问包含在$(文档)的内容。现成的函数:
(关键是同步加载所包含的内容)。
你可以:
<html>
<head>
<script src="jquery.js"></script>
<script>
(function ($) {
$.include = function (url) {
$.ajax({
url: url,
async: false,
success: function (result) {
document.write(result);
}
});
};
}(jQuery));
</script>
<script>
$(document).ready(function () {
alert($("#test").text());
});
</script>
</head>
<body>
<script>$.include("include.inc");</script>
</body>
</html>
include.inc:
<div id="test">
There is no issue between this solution and jquery.
</div>
Jquery包含在github插件
仅使用HTML是不可能将HTML文件包含在另一个HTML文件中。这里有一个很简单的方法。使用这个JS库你可以很容易地做到这一点。只需使用以下代码:
<script> include('path/to/file.html', document.currentScript) </script>