Question

我上一个问题的很多答案都是建议我停止使用框架和iframe并使用DIV。现在我的问题是如何在DIV中包含一个html文件。它看起来并不直接。

Answer 1

应该非常简单易行。

只需在您的网页上加载jQuery并使用load()方法并传入您要加载的文件。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() { // this runs as soon as the page is ready (DOM is loaded)
   $("div") // selecting "div" (you can also select the element by its id or class like in css )
   .load("path/to/your/file.html") // load in the file specified
  });
</script>

Answer 2

通常，您会使用某种形式的include mechanism或template language。

我的偏好是使用Template-Toolkit和the WRAPPER directive用页面模板包装内容。

然而，div不能代替框架。使用最符合语义的标记内容。 Div是最后的选择，因为当有一个具有良好语义的元素时。（它仍然比具有错误语义的元素好很多。）

Answer 3

在我看来，停止使用frames / iframe的建议似乎意味着切换到Ajax。

Answer 4

开始使用服务器端语言而不仅仅是html文件。

PHP's include() function

include("myfile.php");

.NET示例：

string file = Server.MapPath("myfile.txt");
if(System.IO.File.Exists(file)){
   Response.Write(System.IO.File.ReadAllText(file));
}

请记住使用javascript加载内容不会给您带来SEO好处。使用服务器端语言将为您打开大门，无论如何都可以让您的开发更快。你会立即看到好处。您将开始使用include来提取页眉，页脚和内容。好处是，不是通过100个html文件来改变标题导航中的1个项目，而是只执行一次，它将立即在网站的其余部分工作。

如何在div中包含html文件？

4 个答案: