频道栏目
首页 > 资讯 > JavaScript > 正文

jquery实现替代iframe的功能

17-01-10        来源:[db:作者]  
收藏   我要投稿

1.使用iframe能很好的嵌入其他的网页或者网站,但是iframe每次加载都会浪费好多的时间,且会阻止其他元素的加载,搜索引擎也不能识别页面ifram框架中被调用的链接、文本、图片等等内容的。

2.ios不能很好的支持iframe

3.二级页面跳回一级页面,不需要重新加载数据,配合锚点链接使用,可返回到一级页面浏览的那条数据的位置

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代码

$(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);
     });
  });
});
相关TAG标签
上一篇:virtio比ide更快的原因
下一篇:day01-初级-JS0-热身运动、JS入门教程
相关文章
图文推荐

关于我们 | 联系我们 | 广告服务 | 投资合作 | 版权申明 | 在线帮助 | 网站地图 | 作品发布 | Vip技术培训 | 举报中心

版权所有: 红黑联盟--致力于做实用的IT技术学习网站