用ajax替换iframe,使用jQuery和ajax代替iframe

iframe虽然好用,但是其弊端也很明显,一是它不能使用于响应式布局,iframe的使用必须指定高度,而响应式布局的高度兵分固定的。其次iframe不易被搜索引擎的爬虫解读,特别是iframe中嵌套iframe,这是会被搜索引擎认为是个死网站而被放过。

目前主流的应用都使用了ajax代替了iframe

html:

代替iframe的div:

js操作:

$(function(){

$.get("main/main.html",function(data){

$("#iframeContent").html(data);//初始化加载界面

});

$(#indexMenu li).click(function(){//点击li加载界面

var current = $(this),

target = current.find(a).attr(target); // 找到链接a中的targer的值

$.get(target,function(data){

$("#iframeContent").html(data);

});

});

});

iframe虽然好用,但是其弊端也很明显,一是它不能使用于响应式布局,iframe的使用必须指定高度,而响应式布局的高度兵分固定的。其次iframe不易被搜索引擎的爬虫解读,特别是iframe中嵌套iframe,这是会被搜索引擎认为是个死网站而被放过。 目前主流的应用都使用了ajax代替了iframe html: 首页 新闻 留言 资料下载 代替iframe的div: js操作: $(function(){ $.get("main/main.html",function(data){ $("#iframeContent").html(data);//初始化加载界面 }); $(#indexMenu li).click(function(){//点击li加载界面 var current = $(this), target = current.find(a).attr(target); // 找到链接a中的targer的值 $.get(target,function(data){ $("#iframeContent").html(data); }); }); });
经验分享 程序员 微信小程序 职场和发展