0

我确信这是一个相当基本的问题,但我对 jQuery 比较陌生,所以希望有人能提供帮助。

基本上,我需要将 HTML 片段加载到页面中。当代码片段只包含 HTML 时,这可以正常工作,但当它包含脚本时则不行。

为了清楚起见,我已将我的代码精简到最低限度。这是 index.html:

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>    
</head>
<body>
<h1>Heading</h1>
<div id="banner"></div>
<script>
$(document).ready(function(){
    $('#banner').load('banner.html');
});
</script>

</body>
</html>

banner.html 仅包含以下内容(例如):

<h2>Subheading</h2>
<script>
document.write('Hello');
</script>

该脚本被执行,但由于某种原因,它删除了 index.html 和 banner.html 中的 HTML 的其余部分(即它只显示“Hello”而不显示其他内容)。

非常感谢任何帮助!

4

2 回答 2

4

document.write在页面加载写入文档后,同时覆盖文档中当前的所有其他内容,这就是为什么你最终只得到字符串“hello”的原因。

只需删除文件写入:

<h2>Subheading</h2>
<p id="test"></p>
<script>
    document.getElementById('test').innerHTML = 'hello';
</script>
于 2013-07-23T09:31:15.403 回答
0

那是因为当banner.html被加载时..banner.html中的脚本被执行,它在你的文档中写“hello”(这里的文档是你的整个index.html)

理解这一点的一种方法是替换banner.html 的某些内容而不是整个文档。

横幅.html

<h2>Subheading</h2>
<div id="divID"></div>
<script>
  $('#divID').html('hello');  //using jquery .. gets the element with id as divID and replace the HTML 
 </script>

在这里,我只替换 id 为“divID”的 div,而不是替换 enrite 文档

于 2013-07-23T09:32:25.813 回答