包含其他HTML文件的HTML文件 [英] HTML File including another HTML file
问题描述
我创建了一个网页，我想在那里显示另一个HTML文件。我用jQuery来做到这一点，但无法显示我包含的文件的内容。你为什么认为这发生了。
sample.html >
< html>
< head>
< title>仅限样品< / title>
< script type =text / javascriptsrc =https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.js>< /脚本>
< script>
$（function（）{
$（'＃footerLang'）。load（sampleFooter.html）;
}）;
< / script>
< / head>
< body>
< div id =footerLang>
< h1>< / h1>
< / div>
< / body>
< / html>
sampleFooter.html
< p>这是一个徒步旅行< / p>
这很可能是因为您要放置以下块在头部没有 $（document）.on（ready，function（）{...;}）;
$（function（）{
$（'＃footerLang'）。load（sampleFooter.html ）;
}）;
在这种情况下， jQuery 无法找到 #footerLang 元素自 DOM 尚未准备就绪，您可以按照以下步骤修改脚本：
$ $ $ $ $ $ $ $ $ $'$ $ $ $ $' #footerLang'）。load（sampleFooter.html）;
}）;
}）;
或者在< / body>
< html>
< head>
< title>仅限样品< / title>
< script type =text / javascriptsrc =https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.js>< /脚本>
< / head>
< body>
< div id =footerLang>
< h1>< / h1>
< / div>
< script>
$（function（）{
$（'＃footerLang'）。load（sampleFooter.html）;
}）;
< / script>
< / body>
< / html>
I created a web page wherein I want to display there another HTML file. I used jQuery to do this but wasn't able to display the content of the file I have included. Why do you think this happened. Thanks a lot.
Here's my code for my mainpage.
sample.html
<html>
<head>
<title> Sample Only </title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.js"></script>
<script>
$(function(){
$('#footerLang').load("sampleFooter.html");
});
</script>
</head>
<body>
<div id="footerLang">
<h1></h1>
</div>
</body>
</html>
sampleFooter.html
<p> THIS IS A FOOTER </p>
It is highly possibly because you are placing the following block in head without $(document).on("ready", function() { ...; });
$(function(){
$('#footerLang').load("sampleFooter.html");
});
In this case jQuery will unable to find the #footerLang element since the DOM is not ready, you could revise the script as follow
$(function(){
$(document).on("ready", function () {
$('#footerLang').load("sampleFooter.html");
});
});
or move the script tag just before the </body>
<html>
<head>
<title> Sample Only </title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.js"></script>
</head>
<body>
<div id="footerLang">
<h1></h1>
</div>
<script>
$(function(){
$('#footerLang').load("sampleFooter.html");
});
</script>
</body>
</html>
这篇关于包含其他HTML文件的HTML文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
