html页面中引入html

我们写页面通常会遇到这种情况，一个模块很多页面都用到，那么我们为了方便就会单独写到一个页面，然后引入进去，我知道的有三种：

1、用标签<iframe></iframe>

例：

<iframe align="center" height="570" src="lib/sideBarL.html"  frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>

iframe有自己默认的高度，如果你引入的页面高度超出他默认的高度会超出隐藏，所以，要加上height="";

2、用标签<object></object>

例：

<object data="lib/sideBarL.html" type="text/x-scriptlet" height="570"></object>

object也有自己的默认高度，如果你引入的页面高度超出他默认的高度，引入部分会出现纵向滚动条，这个就很影响页面美观了，所以也是要加上height="";

3、div+$(“document”).load(“b.html”)；

例：

<div class="sidebar"></div>

$('.sidebar').load('lib/sideBarL.html');

需要注意的是，这个div里面必须是空的，里面没有任何元素，如果里面有其他的标签，那么你引入的html会替换原来存在的内容。

好啦，就到这里。