注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

面包会有的

php asp 高端网站开发 微信网站开发 视频会议软硬件

 
 
 

日志

 
 

jquery实现替代iframe的功能  

2016-12-26 13:47:17|  分类: jquery |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

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


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);

     });

  });

});


  评论这张
 
阅读(33)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017