将html加载到div而不更改页面的其余部分 [英] Load html into div without changing the rest of page
问题描述
所以我见过很多人问如何将html加载到div中，并且我的代码很好......但是当我将html加载到div时页面的其余部分发生了变化。
我有一个页面a.html，看起来像这样，并加载b.html
a.html
< html>
< head>
< script src =http://code.jquery.com/jquery-1.9.1.js>< / script>
< script>
$（function（）{
$（＃includedContent）。load（b.html）;
}）;
< / script>
< div id =includedContent>< / div>
< h1>这就是我为什么要规定< / h1>
< / head>
< / html>
然后b.html看起来像这样
< p为H.这是我的包含文件< / p>
会发生什么是a.html加载，我可以看到这就是为什么我短暂地规定了，但是随后代码出来并得到了b.html。当b.html加载时，我只能看到这是我的包含文件和'这就是我为什么我规则'的消息消失... ... $ / b
$ b
这是为什么？我如何防止它？它在我测试过的所有浏览器上都是这样。
您必须将您的html代码写入<身体GT; < / body>
< html>
< head>
< script src =http://code.jquery.com/jquery-1.9.1.js>< / script>
< script>
$（function（）{
$（＃includedContent）。load（b.html）;
}）;
< / script>
< / head>
< body>
< div id =includedContent>< / div>
< h1>这就是我为什么要规定< / h1>
< / body>
< / html>
So I've seen tons of people asking how to load html into a div, and my code does that fine....but then the rest of the page changes when I load the html into the div.
I have a page a.html that looks like this, and loads b.html
a.html
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(function() {
$("#includedContent").load("b.html");
});
</script>
<div id="includedContent"></div>
<h1>This is why I rule</h1>
</head>
</html>
then b.html looks like this
<p> This is my include file </p>
What happens is a.html loads and I can see This is why I rule momentarily, but then the code goes out and gets b.html. When b.html loads I can ONLY see This is my include file and the 'This is why I rule' message disappears...
Why is this? How do I prevent it? It does this on all browsers I have tested it on.
You have to write your html code into a <body> </body>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(function() {
$("#includedContent").load("b.html");
});
</script>
</head>
<body>
<div id="includedContent"></div>
<h1>This is why I rule</h1>
</body>
</html>
这篇关于将html加载到div而不更改页面的其余部分的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
