使用iframe能很好的嵌入其餘的網頁或者網站,可是iframe每次加載都會浪費好多的時間,且會阻止其餘元素的加載,搜索引擎也不能識別頁面ifram框架中被調用的連接、文本、圖片等等內容的。javascript
Html代碼html
<ul class="list-side"> <li><a target="a.html" >about</a></li> <li><a target="b.html" >news</a></li> <li><a target="c.html" >product</a></li> <li><a href="http://ucmic.blogspot.com/" target="_blank" >contact</a></li> </ul> <div id="iframe"> <!--jquery 插入html 位址--> </div>
實現功能的Javascript代碼java
$(document).ready(function(){ $.get("a.html",function(data){ //初始將a.html include div#iframe $("#iframe").html(data); }); $(function(){ $('.list-side li').click(function() { // 找出 li 中的超連接 href(#id) var $this = $(this), _clickTab = $this.find('a').attr('target'); // 找到連接a中的targer的值 $.get(_clickTab,function(data){ $("#iframe").html(data); }); }); });