barriers / 阅读 / 详情

怎么将iframe框设置自适应

2023-07-20 12:27:25
共2条回复
S笔记

什么是自适应高度吧。所谓iframe自适应高度,就是,基于界面美观和交互的考虑,隐藏了iframe的border和scrollbar,让人看不出它是个iframe。如果iframe始终调用同一个固定高度的页面,我们直接写死iframe高度就可以了。而如果iframe要切换页面,或者被包含页面要做DOM动态操作,这时候,就需要程序去同步iframe高度和被包含页的实际高度了。

顺便说下,iframe在迫不得已的时候才去用,它会给前端开发带来太多的麻烦。

传统做法大致有两个:

方法一,在每个被包含页在本身内容加载完毕之后,执行JS取得本页面的高度,然后去同步父页面的iframe高度。

方法二,在主页面iframe的onload事件中执行JS,去取得被包含页的高度内容,然后去同步高度。

在代码维护角度考虑,方法二是优于方法一的,因为方法一,每个被包含页都要去引入一段相同的代码来做这个事情,创建了好多副本。

如果只考虑FX和IE,并且,iframe里面内容也不进行DOM操作,那仍然可以用最简单最方便的传统处理方式:

<iframe id="frame_content" src="iframe_b.html" scrolling="no" frameborder="0" onload="this.height=this.contentWindow.document.documentElement.scrollHeight"></iframe>

两个方法都只处理了静的东西,就是只在内容加载的时候执行,如果JS去操作DOM引起的高度变化,都不太方便。

如果在主窗口做一个Interval,不停的来获取被包含页的高度,然后做同步,是不是即方便,又解决了JS操作DOM的问题了呢?答案是肯定的。

Demo页面:主页面 iframe_a.html ,被包含页面 iframe_b.htm 和 iframe_c.html

主页面代码示例:

<iframe id="frame_content" src="iframe_b.html" scrolling="no" frameborder="0"></iframe><script type="text/javascript">

function reinitIframe(){

var iframe = document.getElementById("frame_content");

try{

iframe.height = iframe.contentWindow.document.documentElement.scrollHeight;

}catch (ex){}

}

window.setInterval("reinitIframe()", 200);

</script>

一直执行,效率会不会有问题?

我做了测试,同时开5个窗口(IE6、IE7、FF、Opera、Safari)执行这个代码,不会对CPU有什么影响,甚至调整到2ms,也没影响(基本维持在0%占用率)。

下面谈谈各浏览器的兼容性问题,如何获取到正确的高度,主要是对body.scrollHeight和documentElement.scrollHeight两个值得比较。注意本文用的是这个doctype,不同的doctype应该不会影响结果,但是假如你的页面没有申明doctype,那还是先去加一个吧。

<!DOCTYPE HTML PUBLIC "

在主页面追加以下测试代码,以输出这两个值,代码示例:

<div><button onclick="checkHeight()">Check Height</button></div><script type="text/javascript">

function checkHeight() {

var iframe = document.getElementById("frame_content");

var bHeight = iframe.contentWindow.document.body.scrollHeight;

var dHeight = iframe.contentWindow.document.documentElement.scrollHeight;

alert("bHeight:" + bHeight + ", dHeight:" + dHeight);

}

</script>

被加载页面,可以切换一个绝对定位的层,来使页面高度动态改变。如果层展开,则会撑高页面高度。代码示例:

<div><button onclick="toggleOverlay()">Toggle Overlay</button>

</div>

<div style="height:160px;position:relative">

<div id="overlay" style="position:absolute;width:280px;height:280px;display:none;"></div>

</div>

<script type="text/javascript">

function toggleOverlay() {

var overlay = document.getElementById("overlay");

overlay.style.display = (overlay.style.display == "none") ? "block" : "none";

}

</script>

下面列出以上代码在各浏览器的测试值:

(bHeight = body.scrollHeight, dHeight = documentElement.scrollHeight, 红色 = 错误值, 绿色 = 正确值)

/

层隐藏时

层展开时

bHeight

dHeight

bHeight

dHeight

IE6 184 184 184 303

IE7 184 184 184 303

FF 184 184 184 303

Opera 181 181 300 300

Safari 184 184 303 184

暂且无视Opera比别人少3像素的问题…可以看出,如果没有绝对定位的东西,两个值是相等的,取哪个都无所谓。

但是如果有,那么各个浏览器的表现不太相同,单取哪个值都不对。但可以找到了一条规律,那就是取两个值得最大值可以兼容各浏览器。所以我们的主页面代码就要改造成这样了:

function reinitIframe(){var iframe = document.getElementById("frame_content");

try{

var bHeight = iframe.contentWindow.document.body.scrollHeight;

var dHeight = iframe.contentWindow.document.documentElement.scrollHeight;

var height = Math.max(bHeight, dHeight);

iframe.height = height;

}catch (ex){}

}

window.setInterval("reinitIframe()", 200);

这样子,基本解决了兼容性问题。顺便说下,不光绝对定位的层会影响到值,float也会导致两个值的差异。

如果你演示Demo后,会发现,除了IE,其他浏览器中,当层展开后再隐藏,取到的高度值还是维持在展开的高度303,而非隐藏回去的真正值184,就是说长高了之后缩不回去了。这个现象在不同被包含页面之间做切换也会发生,当从高的页面切换到矮页面的时候,取到的高度还是那个高的值。

可以归纳为,当iframe窗体高度高于文档实际高度的时候,高度取的是窗体高度,而当窗体高度低于实际文档高度时,取的是文档实际高度。因此,要想办法在同步高度之前把高度设置到一个比实际文档低的值。所以,在iframe的添加 onload=”this.height=100″,让页面加载的时候先缩到足够矮,然后再同步到一样的高度。

这个值,在实际应用中决定,足够矮但又不能太矮,否则在FF等浏览器里会有很明显的闪烁。DOM操作的时候主页面无法监听到,只能DOM操作完了之后把高度变小了。

在我的一个实际项目中,在成本和收益之间权衡,我并没有做这个事情,因为每个DOM函数中都要插入这个代码,代价太高,其实层缩回去不缩掉也不是那么致命。包括Demo里,也没有去做这个事情。如果读者有更好的方法,请告诉我。

这是最终的主页面的代码:

<iframe id="frame_content" src="iframe_b.html" scrolling="no" frameborder="0" onload="this.height=100"></iframe>

<script type="text/javascript">

function reinitIframe(){

var iframe = document.getElementById("frame_content");

try{

var bHeight = iframe.contentWindow.document.body.scrollHeight;

var dHeight = iframe.contentWindow.document.documentElement.scrollHeight;

var height = Math.max(bHeight, dHeight);

iframe.height = height;

}catch (ex){}

}

window.setInterval("reinitIframe()", 200);

</script>

附Demo页面: 主页面 iframe_a.html ,被包含页面 iframe_b.htm 和 iframe_c.html

南yi
* 回复内容中包含的链接未经审核,可能存在风险,暂不予完整展示!
iframe自适应宽度和高度,兼容多种浏览器随着窗口大小改变。工作中我们遇到了iframe嵌入页面高度自适应的问题。因为我们不知道所加载的iframe内容页面会有多高,又不想在页面上出现难看的滚动条,这个时候我们可以使用Javascript来动态让iframe自适应高度。
首先我们使用Javascript动态改变iframe的src值,即分别点击两个按钮时,iframe加载不同的页面内容。代码中按钮button分别调用了自定义函数getData()就实现了切换内容的效果。
具体代码参考:https://p***.net/article/8318.html

相关推荐

iframe 是什么

IFRAME元素也就是文档中的文档,或者像浮动的框架(FRAME)。frames集合提供了对IFRAME内容的访问。frame有骨架的意思,而在其前面加个i构成了iframe元素也就是文档中的文档。示例——  下面的例子使用了IFRAME元素创建了包含页面sample.htm的框架。  iframe标签--代表HTML内联框架*iframe标签是成对出现的,以<iframe>开始,</iframe>结束*属性oname--定义了内容页名称,此名称在框架页内链接时使用到  oframeborder--定义了内容页的边框,取值为(1|0),缺省值为1  omarginwidth--定义了框架中HTML文件显示的左右边界的宽度,取值为px,缺省值由浏览器决定omarginheight--定义了框架中HTML文件显示的上下边界的宽度,取值为px,缺省值由浏览器决定oalign--垂直或水平对齐方式oheight--框架的高度owidth--框架的宽度具体示例——<html><head><title>内嵌示例1</title></head><body><iframesrc="a.htm"frameborder="0"scrolling="yes"height="100px"width="100px"noresize="noresize"></iframe></body></html>这个在页面上显示为一个嵌在页面的框架,没有边框,有滚动条,该框架的大小为长100像素,宽100像素,不被允许拉动页面边框。<html><head><title>内嵌示例2</title></head><body><iframename="res"style="display:none;"src="a.htm"frameborder=“0”scrolling="yes"height="100px"width="100px"></iframe><formtarget="res"></form>用隐含的iframe提交数据,可以避免页面刷新。</body></html>
2023-07-20 10:24:191

iframe有什么用?

HTML元素 - iframe定义创建内嵌漂浮框架。Creates inline floating frames. 注释IFRAME 元素的作用相当于在一个文档中嵌入另一个文档,或者像一个漂浮的 FRAME。此元素在 Internet Explorer 4.0 及以上版本的 HTML 和脚本中可用。此元素是一个块元素。此元素需要关闭标签。The IFRAME element functions as a document within a document, or like a floating FRAME. This element is available in HTML and script as of Internet Explorer 4.0.This element is a block element.This element requires a closing tag.示例代码<html><body><p>这个 HTML 文档中使用 IFRAME 来显示另外一个叫Frame_a.html 的网页。</p><iframe src="../asdocs/html_tutorials/Frame_a.html"></iframe></body></html>演示示例:用 IFRAME 在一个 HTML 页里显示另一个网页
2023-07-20 10:24:271

iframe说明与用法

一、记录说明 二、iframe说明 <iframe></iframe>标签用于定义一个页面的内联框架。就是在一个html页面中分出小块,然后用iframe把其他网页嵌入进来,这小块就会显示其他html页面的内容了。 三、iframe标签常用属性 四、父、子页面常用方法 1、父页面 注意:iframe加载也需要时间(相当于重新打开一个页面),需要在父页面操作子页面,要等子页面加载完成,iframe常加上onload事件,jq常加上 $("#iframeId").load(function(){}); 再开始操作子页面。 2、子页面 五、实例 这里也包含了项目中写的常用的公共函数。为了方便js直接嵌入html中。因为jquery很方便,也引入了。 六、替换方法 1、ajax获取页面操作DOM加载。jquery也有提供 $("divId").load(".html") 直接加载的方法。 2、vue等框架,组件。
2023-07-20 10:24:341

怎么让iframe自适应浏览器的高度和宽度

让iframe自适应浏览器的高度和宽度的具体步骤如下:1、首先设置样式:body{margin:0; padding:0;}。2、如果不设置body的margin和padding为0的话,页面上下左右会出现空白。html代码如下:<iframe src="http://www.fulibac.com" id="myiframe" scrolling="no" frameborder="0"></iframe>。3、这个方法可以达到让iframe自适应高度的效果,但是如果将窗口放大或缩小效果就不出来了,也就是本文开头讲的。需要再次刷新,那就不属于自适应了。代码是:var ifm= document.getElementById("myiframe");ifm.height=document.documentElement.clientHeight;
2023-07-20 10:24:457

IFRAME是什么

  iframe也称作嵌入式框架,嵌入式框架和框架网页类似,它可以把一个网页的框架和内容嵌入在现有的网页中。  框架(framework)是一个基本概念上的结构,用于去解决或者处理复杂的问题。这个广泛的定义使用的十分流行,尤其在软件概念。框架也能用于机械结构。
2023-07-20 10:25:532

关于iframe的一些知识

1、iframe的创建比一般的DOM元素慢了1-2个数量级 iframe的创建比其他包括scripts和css的DOM元素的创建慢了1-2个数量级。当然页面一般不会包含太多的iframe,所以创建DOM节点花费的时间还不会占很大比重。 2、阻塞页面加载 及时触发window的onload事件是非常重要的。onload事件触发使浏览器的“忙”指示器停止,告诉用户当前网页已经加载完毕。当onload事件加载延迟后,它给用户的感觉是这个网页非常慢。 window的onload事件需要在所有iframe加载完毕后(包含里面的元素)才会触发。通过Javascript动态设置iframe的src可以避免这种阻塞情况。 3、唯一的连接池 浏览器只能开少量的连接到web服务器。绝大部分浏览器,主页面和其中的iframe是共享这些连接的。这意味着iframe在加载资源时可能用光了所有的可用连接,从而阻塞了主页面资源的加载。如果iframe中的内容比主页面的内容更重要,这当然是好的。但通常情况下,iframe里的内容是没有主页面重要的。这时iframe用光可用连接就不值得了。 4、不利于SEO 搜索引擎的检索程序无法解读iframe。另外,iframe本身不是动态语言,样式和脚本都需要额外导入。 综上,iframe应谨慎使用。
2023-07-20 10:26:001

怎样使用iframe,在网页中插入页面

首先,我们使用DreamWeaver新建一个站点,将我们需要归纳到一个页面的网页都包含在这个站点里面。然后我们找到一个需要嵌入页面的html文件,使用DW软件打开,找到需要插入页面的位置。3然后我们输入<iframe></iframe>标签。在前半个标签的里面,空格一下就会出现我们可以设置的属性。4我们需要设置src,即我们需要引用的页面的地址。并且,我们可以简单的设定一下我们的iframe框架的border以及是否有滚动条5除此之外,我们还应该设定这个iframe框架的宽度,一般来说我们都将其宽度设为100%,高度设为500px,由于在iframe标签内设置的宽和高都是具体值,我们需要给iframe一个class,然后设置style6这样一个iframe框架就嵌入到我们的网页当中了,我们可以按下ctrl+s,并按下F12,就可以在浏览器中查看效果图,我用红色框起来的部分就是我们嵌入的页面
2023-07-20 10:26:071

如何用iframe代码显示调用网页的指定部分

别人用的什么方法我不知道,不过我可以给你指条道儿,这个是我以前用过的办法,就是用2个iframe来套用,假设你要引用当前这个问题的页面中右侧的那个“分类上升达人排行榜”,直接iframe这个http://zhidao.baidu.com/question/123277073.html肯定是不行的。无法控制位置,所以我想了个办法,用2个iframe框架来调用,先做一个调用这个框架的页面load.htm,代码如下:<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>无标题文档</title></head><body><iframe src="http://zhidao.baidu.com/question/123277073.html" width="980" height="700" frameborder="0" scrolling="no" style="position: absolute; top: -120px; left: -680px;"></iframe></body></html>这个页面用iframe框架引用了http://zhidao.baidu.com/question/123277073.html页面,并且用CSS定位设定了框架浮动位置。然后我在需要调用http://zhidao.baidu.com/question/123277073.html的页面这样写:<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>无标题文档</title></head><body><iframe src="Untitled-1.html" width="300" height="230" frameborder="0" scrolling="no"></iframe></body></html>打开看一下,只能看到“分类上升达人排行榜”这一小块儿了吧。其他的全看不到了。不知道你看懂没有,如果没看懂,你照我说的做一下试试应该就明白了。这只是一个变通的方法,这样调用就不存在所谓的权限问题,比起利用浏览器漏洞要好用的多吧。
2023-07-20 10:26:151

IFrame在网页中有什么作用?

把一个网页的页面,里放上几个网页
2023-07-20 10:26:302

HTML 标签定义和用法

<script type="text/javascript">定义和用法:iframe 元素会创建包含另外一个文档的内联框架(即行内框架)。提示:您可以把需要的文本放置在 <iframe> 和 </iframe> 之间,这样就可以应对无法理解 iframe 的浏览器。属性①align属性值:left、right、top、middle、bottom;属性的作用:规定如何根据周围的元素来对齐此框架。属性的说明:不赞成使用该属性。请使用样式代替。属性②frameborder属性值:1、0属性作用:规定是否显示框架周围的边框。属性③height属性值:pixels、%属性作用:规定 iframe 的高度。属性④longdesc属性值:URL属性作用:规定一个页面,该页面包含了有关 iframe 的较长描述。属性⑥marginheight属性值:pixels属性作用:定义 iframe 的顶部和底部的边距。属性⑦marginwidth属性值:pixels属性作用:定义 iframe 的左侧和右侧的边距。属性⑧name属性值:frame_name属性作用:规定 iframe 的名称。属性⑨scrolling 属性值:yes、no、auto属性作用:规定是否在 iframe 中显示滚动条。属性(10)src属性值:URL属性作用:规定在 iframe 中显示的文档的 URL。属性(11)width 属性值:pixels、%属性作用:定义 iframe 的宽度。$(function () {document.getElementById("ifm").src ="";//Url地址$("#ifm").load(function () {var h = document.body.clientHeight;var w = document.body.clientWidth;document.getElementById("ifm").height = h + "px";document.getElementById("ifm").width = w + "px";});})</script><body style="overflow-y:hidden;overflow-x:hidden"><div id="pageone" style=""><iframe name="ifm" id="ifm" scrolling="yes" style="background-color: transparent;" marginwidth="0" marginheight="0" frameborder="0"></iframe></div></body>
2023-07-20 10:26:502

iframe是什么意思?

IFRAME 元素也就是文档中的文档,或者像浮动的框架(FRAME)。frames 集合提供了对 IFRAME 内容的访问。frame有骨架的意思 而在其前面加个i构成了iframe元素也就是文档中的文档。使用iframe可以在网页中再嵌入一个网页
2023-07-20 10:26:571

iframe什么意思?????????怎么用????????

那是框架在俗语中被说frame为桢的意思要是你喜欢做网页那就应该好好的看看html教材对与动画熟悉的人的人都知道桢但是这里这个桢并不是动画的桢而是网页的框架就是不一个网页分成好几份的框架它可使你的网页达到很好的效果
2023-07-20 10:27:063

在一个静态网页 有一个iframe标签 我要让iframe 默认显示一个网页怎么办?

业面数字时间
2023-07-20 10:27:162

iframe窗口怎么防穿透

event代码。iframe阻止点击穿透,上层点击时加上event这句,阻止事件冒泡到父元素,为上层添加下面样式代码即可。iframe是嵌入式框架html标签还是一个内联元素,iframe元素会创建包含另外一个文档的内联框架,也是一个比较特殊的框架,可以放在浏览器中的小窗口,可以出现在页面的任何一个位置上。
2023-07-20 10:27:291

框架嵌套iframe标签常见的几种使用方法

先来看看百度百科对于iframe标签元素的介绍!都是比较详细,接着就是实际的应用了!2新建一个记事本文件,并将它重命名为.html文件,添加必要的<html><body>标签,为了便于说明,同时添加<head>和<title>,将标题改名为iframe元素标签的使用!3在<body>中添加iframe,ulr为你要嵌套网页的地址,需要带上http的,由于经验不上带有网址,不演于演示,width,height为所占用的宽度和高度,以百度首页为例,当然嵌套两个网页也是可以的!4当然嵌套两个网页或者多个网页也是可以的,高度和宽度都可以自行设置!5再看其他的比较常用的可选属性,如name,通过对定义好的名字,就指定框架页面进行跳转!6至于其他可选属性,就不再一一举例,看看解析,再试验一下就清楚了,如scrolling="no"就是不显滚动条,align控制框架的对齐方式等等,用法都差不多!7源代码:<html><head><title>iframe元素标签的使用</title><body><a href="url" target="iframe1">跳转到百度经验</a><br/><iframe src="url" width="600px" height="400px" name="iframe1"scrolling="no"/><iframe src="url" width="600px" height="400px" name="iframe2" align="right"/></body></head></html>
2023-07-20 10:27:381

如何隐藏显示iframe

下面是隐藏显示的代码: index. <> <head> <meta HTTP-EQUIV="Content-Type" CONTENT="text/; charset=gb2312"> <meta name=GENERATOR content="Microsoft FrontPage 4.0"> <meta name=ProgId content="FrontPage.Editor.Document"> <title>frame框架的显示隐藏操作 - 51windows</title> </head> <frameset name=full rows="64,*,64"> <frame name=top scrolling="no" xnoresize target="contents" src=top.> <frameset cols="25%,*" name=cen> <frame name=contents target="main" src=left.> <frame name=main src=main.> </frameset> <frame name=bottom scrolling="no" xnoresize target="contents" src=bottom.> <noframes> <body> <p>此网页使用了框架,但您的浏览器不支持框架。 </p> </body> </noframes> </frameset> </> main. <> <head> <meta -equiv="Content-Type" content="text/; charset=gb2312"> <meta name=GENERATOR content="Microsoft FrontPage 4.0"> <meta name=ProgId content="FrontPage.Editor.Document"> <title>main - 51windows</title> </head> <body> <SCRIPT LANGUAGE="javascript"> <!-- function shtop{ if (parent.full.rows.indexOf("0,*,")!=-1){ parent.full.rows="64,*,"+parent.full.rows.split(",")[2] document.getElementById("shtop").value="隐藏上部"; } else{ parent.full.rows="0,*,"+parent.full.rows.split(",")[2] document.getElementById("shtop").value="显示上部"; } } function shleft{ if (parent.cen.cols=="0,*"){ parent.cen.cols="25%,*," document.getElementById("shleft").value="隐藏左部"; } else{ parent.cen.cols="0,*" document.getElementById("shleft").value="显示左部"; } } function shbottom{ if (parent.full.rows.indexOf(",*,0")!=-1){ parent.full.rows=parent.full.rows.split(",")[0]+",*,64" document.getElementById("shbottom").value="隐藏下部"; } else{ parent.full.rows=parent.full.rows.split(",")[0]+",*,0" document.getElementById("shbottom").value="显示下部"; } } function maxmain{ if (parent.full.rows=="0,*,0"){ parent.full.rows="64,*,64" parent.cen.cols="25%,*" document.getElementById("maxmain").value="隐藏左上下"; document.getElementById("shtop").value="隐藏上部"; document.getElementById("shleft").value="隐藏左部"; document.getElementById("shbottom").value="隐藏下部"; } else{ parent.full.rows="0,*,0"; parent.cen.cols="0,*"; document.getElementById("maxmain").value="显示左上下"; document.getElementById("shtop").value="显示上部"; document.getElementById("shleft").value="显示左部"; document.getElementById("shbottom").value="显示下部"; } } //--> </SCRIPT> <input type=button name=maxmain id="maxmain" onclick="maxmain;" value="隐藏左上下"> <input type=button name=shtop id="shtop" onclick="shtop;" value="隐藏上部"> <input type=button name=shleft id="shleft" onclick="shleft;" value="隐藏左部"> <input type=button name=shbottom id="shbottom" onclick="shbottom;" value="隐藏下部"> </body> </> 框架的嵌套: <> <head> </head> <body> <iframe width=468 height=60 src=abc.aspx></iframe> <iframe width=468 height=60 src=cde.aspx></iframe> </body> </> ################################################# <> <head> <meta -equiv="content-type" content="text/; charset=gb2312"> <title>无标题文档</title> </head> <frameset rows="77,181" cols="*" framespacing="0" border=0> <frame src=abc.aspx> <frame src=cde.aspx> </frameset> <noframes><body> </body></noframes> </> //*****************说明************************: frameset是框架,一个网页被划分成几个块, 每个块为不同的网页文件。 iframe是内嵌网页,可以被嵌在一个页页的任何地方。 一般iframe使用灵活些。 当使用框架时页面中不应该有body标签。 frameset标签是成对出现的,以<frameset>开始,</frameset>结束,里面用frame。 frameset里面还能嵌入frameset。 嵌套框架,框架可以进行多层嵌套。 frameset里面的id,为了方便后面用Javascript来访问这个对象. 如下: <frameset rows="58,*" frameborder="NO" border=0 framespacing="0"> <frame src=top. name=topFrame scrolling="NO" noresize ><!--页头--> <frameset rows="*,20" cols="*" framespacing="0" frameborder="NO" border=0> <frameset rows="*" cols="120,15,*" framespacing="0" frameborder="NO" border=0 id="leftFrameSet"> <frame src=menu. name=leftFrame scrolling="NO" noresize><!--菜单--> <frame src=mid. name=midFrame scrolling="NO" noresize><!--菜单收缩条--> <frameset rows="35,*" framespacing="0" frameborder="NO" border=0> <frame src=navi. name=righttop scrolling="NO" noresize><!--导航--> <frameset cols="*,200" framespacing="0" frameborder="NO" border=0> <frame src= name=mainFrame> <frame src= name=rightFrame scrolling="NO"> </frameset> </frameset> </frameset> <frame src=bottom. name=bottomFrame scrolling="NO" noresize><!--页尾--> </frameset> </frameset>
2023-07-20 10:27:461

为什么前端尽量少用iframe?

网站设计使用Iframe缺点一:得罪搜索引擎“蜘蛛”网站设计使用Iframe最大的弊端就是得罪了搜索引擎的“蜘蛛”,当蜘蛛访问Iframe布局的网站时,它只会看到框架,框架里面的内容是看不到的,也就无法按照顺序解读页面,会认为这个网站是个死站点,以后绝不会再来了。网站设计使用Iframe缺点二:链接导航问题使用Iframe布局必须保证正确设定导航链接,否则,被链接的页面呈现在导航框架内,让浏览者无法退后,只能离开。网站设计使用Iframe缺点三:分散访问者注意力Iframe布局的网站除了有时会让浏览者迷惑,分散注意力之外,还会给浏览者带来浏览麻烦,滚动条会使Iframe布局混乱,让浏览者望而止步。所以iframe通常会用在后台页面的构建山
2023-07-20 10:28:271

如何实现关闭iframe

document.parentWindow.frameElement.style.display="none";我也是刚遇到这个问题。嘿嘿,貌似这样可以。
2023-07-20 10:28:364

HTML iframe 和 frameset 的区别

一: <Frameset>为框架标记,说明该网页文档为框架组成,并设定文档中组成框架集的框架的布局,用来划分框架,每一个框架由<Frame></Frame>标记。<Frame>用以设置组成框架集中各个框架的属性。<Frame></Frame>必须在<Frameset></Frameset>之内使用。注意:<Frame></Frame>标记的框架顺序为从左至右或从上到下。二: Iframe是Inline Frame的缩写,称为内联框架,它和frame如同兄弟。frame是帧标记,Iframe叫浮动帧标记,它不同于Frame标记最大的特征即这个标记所引用的HTML文件不是与另外的HTML文件相互独立显示,而是可以直接嵌入在一个HTML文件中,与这个HTML文件内容相互融合,成为一个整体;因为它可以多次在一个页面内显示同一内容,而不必重复写内容,所以人们形象称这种效果为“画中画”。
2023-07-20 10:29:171

如何在子页面得到其所在的iframe

Js代码 1.//根据iframe的id获取对象 2.var i1 = window.frames["iframeId"]; 3.//var iframe =window.frames[0];也可以 4.//获取iframe中的元素值 5.var val=i1.document.getElementById("t1").value //根据iframe的id获取对象var i1 = window.frames["iframeId"];//var iframe =window.frames[0];也可以//获取iframe中的元素值var val=i1.document.getElementById("t1").value
2023-07-20 10:29:254

怎么设置iframe里的默认页?

iframe标签里的src属性,例如:<iframewidth="100"height="100"src="b.html"></iframe>默认页为b.html
2023-07-20 10:30:012

如何使用iframe代码调用网页中的某个一部分

别人用的什么方法我不知道,不过我可以给你指条道儿,这个是我以前用过的办法,就是用2个iframe来套用,假设你要引用当前这个问题的页面中右侧的那个“分类上升达人排行榜”,直接iframe这个http://zhidao.baidu.com/question/123277073.html肯定是不行的。无法控制位置,所以我想了个办法,用2个iframe框架来调用,先做一个调用这个框架的页面load.htm,代码如下:<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>无标题文档</title></head><body><iframe src="http://zhidao.baidu.com/question/123277073.html" width="980" height="700" frameborder="0" scrolling="no" style="position: absolute; top: -120px; left: -680px;"></iframe></body></html>这个页面用iframe框架引用了http://zhidao.baidu.com/question/123277073.html页面,并且用CSS定位设定了框架浮动位置。然后我在需要调用http://zhidao.baidu.com/question/123277073.html的页面这样写:<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>无标题文档</title></head><body><iframe src="Untitled-1.html" width="300" height="230" frameborder="0" scrolling="no"></iframe></body></html>打开看一下,只能看到“分类上升达人排行榜”这一小块儿了吧。其他的全看不到了。不知道你看懂没有,如果没看懂,你照我说的做一下试试应该就明白了。这只是一个变通的方法,这样调用就不存在所谓的权限问题,比起利用浏览器漏洞要好用的多吧。
2023-07-20 10:30:081

iframe用法

iframe
2023-07-20 10:30:363

做SEO网站优化要不要使用iframe标签

首先我们需要来了解一下什么是iframe标签。iframe标记,又叫浮动帧标记,你可以用它将一个HTML文件嵌入在另一个HTML中显示。它不同于Frame标记最大的特征即这个标记所引用的HTML文件不是与另外的HTML文件相互独立显示,而是可以直接嵌入在一个HTML文件中,与这个HTML文件内容相互融合,成为一个整体,另外,还可以多次在一个页面内显示同一内容,而不必重复写内容,甚至可以在同一HTML文件嵌入多个HTML文件。iframe标签的基本语法iframe标签总是成对出现的以<iframe>开始并以</iframe>结束:<iframe>……/iframe>。iframe标签的属性
2023-07-20 10:30:462

HTML+JS 如何用按扭实现Iframe.src切换

<iframe id="USERPIC" src="1.html"></iframe> <input type="button" onclick="PicGo()" /> <script language="javascript" > var i=1;function PicGo(){ document.getElementById("USERPIC").src=i+".html";i++;if (i==11){i=1;} } </script>
2023-07-20 10:30:553

iframe的优缺点

1. 解决加载缓慢的第三方内容如图标和广告等的加载问题 2. Security sandbox 3. 并行加载脚本 缺点: 1. iframe会阻塞主页面的Onload事件 2. 即时内容为空,加载也需要时间 3. 没有语意
2023-07-20 10:31:141

iframe如何加速

纵观时下网站,本来网速就有些慢,可是几乎每页都要放什么Banner,栏目图片,版权等一大堆雷同的东西,当然,出于网站风格统一、广告效应的需要,本无可厚非,可毕竟让用户的钱包为这些“点缀“的东西”日益消得钱憔悴”了,有没有办法,让这些雷同的东西一次下载后就不用再下载,而只下载那些内容有变化区域的网页内容呢?  答案很肯定 :应用Iframe标记!  一、Iframe标记的使用  提起Iframe,可能你早已将之扔到“被遗忘的角落”了,不过,说起其兄弟Frame就不会陌生了。Frame标记即帧标记,我们所说的多帧结构就是在一个浏览器窗口中显示多个HTML文件。现在,我们遇到一种很现实的情况:如有一个教程,是一节一节地上,每页末尾做一个“上一节“、“下一节“的链接,除了每节教程内容不同之外,页面其它部分内容都是相同的,如果一页一页地做笨页面,这似乎太让人厌烦了,这时突发奇想,如果有一种方法让页面其它地方不变,只将教程做成一页一页的内容页,不含其它内容,在点击上下翻页链接时,只改变教程内容部分,其它保持不变,这样,一是省时,另则以后如教程有个三长两短的变动,也很方便,不致于牵一发而动全军了;更重要的是将那些广告Banner、栏目列表、导航等几乎每页的都有的东西只下载一次后就不再下载了。  Iframe标记,又叫浮动帧标记,你可以用它将一个HTML文档嵌入在一个HTML中显示。它不同于Frame标记最大的特征即这个标记所引用的HTML文件不是与另外的HTML文件相互独立显示,而是可以直接嵌入在一个HTML文件中,与这个HTML文件内容相互融合,成为一个整体,另外,还可以多次在一个页面内显示同一内容,而不必重复写内容,一个形象的比喻即“画中画“电视。  现在我们谈一下Iframe标记的使用。  Iframe标记的使用格式是:  <Iframe src="URL" width="x" height="x" scrolling="[OPTION]" frameborder="x"></iframe>  src:文件的路径,既可是HTML文件,也可以是文本、ASP等;  width、height:"画中画"区域的宽与高;  scrolling:当SRC的指定的HTML文件在指定的区域不显不完时,滚动选项,如果设置为NO,则不出现滚动条;如为Auto:则自动出现滚动条;如为Yes,则显示;  FrameBorder:区域边框的宽度,为了让“画中画“与邻近的内容相融合,常设置为0。比如:  <Iframe src="http://netschool.cpcw.com/homepage" width="250" height="200" scrolling="no" frameborder="0"></iframe>  二、父窗体与浮动帧之间的相互控制  在脚本语言与对象层次中,包含Iframe的窗口我们称之为父窗体,而浮动帧则称为子窗体,弄清这两者的关系很重要,因为要在父窗体中访问子窗体或相反都必须清楚对象层次,才能通过程序来访问并控制窗体。  1、在父窗体中访问并控制子窗体中的对象  在父窗体中,Iframe即子窗体是document对象的一个子对象,可以直接在脚本中访问子窗体中的对象。  现在就有一个问题,即,我们怎样来控制这个Iframe,这里需要讲一下Iframe对象。当我们给这个标记设置了ID 属性后,就可通过文档对象模型DOM对Iframe所含的HTML进行一系列控制。  比如在example.htm里嵌入test.htm文件,并控制test.htm里一些标记对象:  <Iframe src="test.htm" id="test" width="250" height="200" scrolling="no" frameborder="0"></iframe>test.htm文件代码为:  <html>   <body>    <h1 id="myH1">hello,my boy</h1>   </body>  </html>  如我们要改变ID号为myH1的H1标记里的文字为hello,my dear,则可用:  document.myH1.innerText="hello,my dear"(其中,document可省)  在example.htm文件中,Iframe标记对象所指的子窗体与一般的DHTML对象模型一致,对对象访问控制方式一样,就不再赘述。  2、在子窗体中访问并控制父窗体中对象  在子窗体中我们可以通过其parent即父(双亲)对象来访问父窗口中的对象。  如example.htm:  <html>   <body οnclick="alert(tt.myH1.innerHTML)">    <Iframe name="tt" src="frame1.htm" width="250" height="200" scrolling="no" frameborder="0"></iframe>    <h1 id="myH2">hello,my wife</h1>   </body>  </html>  如果要在frame1.htm中访问ID号为myH2中的标题文字并将之改为"hello,my friend",我们就可以这样写:  parent.myH2.innerText="hello,my friend"  这里parent对象就代表当前窗体(example.htm所在窗体),要在子窗体中访问父窗体中的对象,无一例外都通过parent对象来进行。  Iframe虽然内嵌在另一个HTML文件中,但它保持相对的独立,是一个“独立王国“哟,在单一HTML中的特性同样适用于浮动帧中。  试想一下,通过Iframe标记,我们可将那些不变的内容以Iframe来表示,这样,不必重复写相同的内容,这有点象程序设计中的过程或函数,减省了多少繁琐的手工劳动!另外,至关重要的是,它使页面的修改更为可行,因为,不必因为版式的调整而修改每个页面,你只需修改一个父窗体的版式即可了。  有一点要注意,Nestscape浏览器不支持Iframe标记,但在时下IE的天下,这似乎也无大碍,广泛采用Iframe标记,既为自己(网站)着了想,又为网友节省了网费,何乐而不为?点击阅读全文 打开CSDN,阅读体验更佳网页加速系列_weixin_34259232的博客网页加速系列(一)、 网页加速之图形处理篇 搜集到一些关于网站提速的资料,做一个系列,一些文章可能转或摘自网络。 (一)、 网页加速之图形处理篇 在维护网站的过程用,可能遇到过这样的情况:辛辛苦苦做出来的页面,但图片过多,网页结构...14条让你的网页加速_ok7758521ok的博客这本书里定义了14条让你的网页加速的方法,分别如下: 1.Make fewer HTTP requests 2.Use a CDN 3.Add an Expires header 4.Gzip components 5.Put CSS at the top 6.Move JS to the bottom ...“画中画”效果--谈IFRAME标签的使用作者:秋实 文章来源:天极网页陶吧 纵观时下网站,本来网速就有些慢,可是几乎每页都要放什么Banner,栏目图片,版权等一大堆雷同的东西,当然,出于网站风格统一、广告效应的需要,本无可厚非,可毕竟让用户的钱包为这些“点缀“的东西”日益消得钱憔悴”了,有没有办法,让这些雷同的东西一次下载后就不用再下载,而只下载那些内容有变化区域的网页内容呢?   答案很肯定:应用Iframe标记!   一、I继续访问怎么让iframe加载内容速度更快,用target而不是用js更改iframe的src$(".expmenu a").attr("target","main_frame"); //这样比用js更改iframe的src加载内容更快继续访问ppt iframe加载项_PPT启动卡爆了?一招帮你瞬间提速!_血汗钱被抢的博客...这里给大家解释一下,PPT 插件安装后默认是随软件一起打开的,所以我们得等插件加载完才能使用 Office,加载是需要一定时间的,这个时间长短取决于你电脑的配置。 哪有人会为了一个 PPT 去升级电脑配置嘛?!网站建设html代码优化,网站设计代码优化让网站打开速度飞起来_别总叫...(1)巧用IFRAME布局 巧用iframe加快网页打开速度。如果网页上插入一些广告代码,又不想让这些广告网站影响 度的话,那么,使用iframe最合适不过了。例如在某个首页上插入一些广告代码方法:将这些广告代码放到一个独立的页面去,然后在首页用if...热门推荐 iframe标签用法详解iframe标签用法详解继续访问iframe嵌套页面加载慢_web前端入门到实战:分析页面加载慢一般情况下,如果网页加载时间超过5s,用户就会感觉页面比较卡,用户体验相当差,用户可能会直接走人,所以加载的时间对于一个网站来说还是相当重要的。那做项目的时候怎样分析页面的加载速度慢呢?首先我们要知道影响页面加载的因素JS性能太差,阻塞页面浏览器解析过程中,遇到<script>标签的时候,便会停止解析过程,转而去处理脚本,如果脚本是内联的,浏览器会先去执行这段内联的脚本,如果是外链的,...继续访问提升页面加载速度的方案_聂曦r的博客_提升页面加载速度、释放资源:手动将iframe的内存释放、定时器销毁等 五、DNS优化 减少DNS查询,首先要了解访问路由到页面加载这个过程中间的流程,当用户在浏览器回车瞬间浏览器会解析域名向服务器发起TCP的3次握手,建立连接后发起HTTP请求,服务器响应请求返回...微前端实际应用:iframe、qiankun_偷吃零食的小猫咪的博客_前端...在上面的基础中了解到,目前常用的微前端实现方案有多种,其中目前常见使用的是qiankun,以前常用的框架是iframe的微前端方案,下面我们先来学习一下之前的框架iframe实现微前端方案 1、iframe 1-1 iframe基本理解 在之前使用iframe的时候,是...iframe嵌套页面加载慢_Chrome 现已支持延迟加载网页中的 iframe,速度翻倍提升谷歌曾在 Chrome 76 中添加了对图片的延迟加载支持。近日,ChromeEng 经理 Addy Osmani 则宣布,该团队已将 iframe 的延迟加载作为标准功能,添加至了 Chrome 浏览器和 Chromium 浏览器中。该功能会延迟窗口外 iframe 的加载,直到用户将网页滚动到附近为止。此举可以节省数据、加快页面其他部分的加载速度,并减少内存使用量。Chrome 小组的研究表明...继续访问加快ui显示速度 by iframeiFrame: 为了能并行的加载JavaScript,避免浏览器卡住(http://goo.gl/lzGq8),我在页面的body标记的顶部的一个Iframe里加载JavaScript。在iframe里加载JavaScript增加了代码的复杂度(通过Closure,我们很好的解决了这个问题),但是为了速度的提升,值得这样做。继续访问最新发布 速度html代码是什么问题,HTML-加速、再加速_html来源:中国教程网web开发人员是否必须掌握复杂的组件技术才能加快html页面的访问速度?答案是:不一定!实际上,有许多关于HTML与DHTML方面的技巧,它们原理简单而且上手容易。无论是技术高超的老手,还是初涉编程的菜鸟,领会这些都十分必要。明显HTML,暗渡“公用脚本”减少web页面下载时间的关键就是设法减小文件大小。当多个页面共用一些成分内容时,就可以考虑将这些公用部分单独分离出来。比如:我们.
2023-07-20 10:31:231

js文件中iframe是什么意思

iframe是嵌入式框架,一般用来在已有的页面中嵌入另一个页面。需要注意的是,iframe在html5中,已经有限支持了(只有src属性)。
2023-07-20 10:31:311

html 怎么获取iframe的值

同域或跨子域读写操作iframe里的内容父页面读写操作子页面:HTMLcode<iframeid="test-iframe"name="test-iframe"src="child.html"scrolling="no"frameborder="0"></iframe><script>window.onload=function(){/**下面两种获取节点内容的方式都可以。*由于IE6,IE7不支持contentDocument属性,所以此处用了通用的*window.frames["iframeName"]orwindow.frames[index]*/vard=window.frames["test-iframe"].document;d.getElementsByTagName("h1")[0].innerHTML="pp";alert(d.getElementsByTagName("h1")[0].firstChild.data);}</script>
2023-07-20 10:31:471

iframe是什么意思?

HTML元素 - iframe定义创建内嵌漂浮框架。Creates inline floating frames. 注释IFRAME 元素的作用相当于在一个文档中嵌入另一个文档,或者像一个漂浮的 FRAME。此元素在 Internet Explorer 4.0 及以上版本的 HTML 和脚本中可用。此元素是一个块元素。此元素需要关闭标签。The IFRAME element functions as a document within a document, or like a floating FRAME. This element is available in HTML and script as of Internet Explorer 4.0.This element is a block element.This element requires a closing tag.示例代码<html><body><p>这个 HTML 文档中使用 IFRAME 来显示另外一个叫Frame_a.html 的网页。</p><iframe src="../asdocs/html_tutorials/Frame_a.html"></iframe></body></html>演示示例:用 IFRAME 在一个 HTML 页里显示另一个网页
2023-07-20 10:32:131

iframe是什么意思?

HTML元素 - iframe定义创建内嵌漂浮框架。Creates inline floating frames. 注释IFRAME 元素的作用相当于在一个文档中嵌入另一个文档,或者像一个漂浮的 FRAME。此元素在 Internet Explorer 4.0 及以上版本的 HTML 和脚本中可用。此元素是一个块元素。此元素需要关闭标签。The IFRAME element functions as a document within a document, or like a floating FRAME. This element is available in HTML and script as of Internet Explorer 4.0.This element is a block element.This element requires a closing tag.示例代码<html><body><p>这个 HTML 文档中使用 IFRAME 来显示另外一个叫Frame_a.html 的网页。</p><iframe src="../asdocs/html_tutorials/Frame_a.html"></iframe></body></html>演示示例:用 IFRAME 在一个 HTML 页里显示另一个网页
2023-07-20 10:32:201

iframe什么意思

iframe就是框架网页就是在同一个页面里有多个网页,使用框架的好处就是你在请求一个网页的下一个页面的时候,还有 一个网页是一直显示着的,这样浏览者就不会就的等待的存在了..iframe使用很简单,使用src属性指向另一个你需要包含的另一个文件即可,也可以通知制定宽(width),高(height)等。比如: -------------------------------------------------------------------------------- 用IFRAME实现网页的内嵌和预载 http://www.sina.com.cn 2001/09/04 14:37 中国电脑教育报 刘明锋 在HTM(HTML)文件中是否可以像PHP、ASP文件一样嵌入其他文件呢?下面笔者介绍用iframe来实现的方法。 iframe元素的功能是在一个文档里内嵌一个文档,创建一个浮动的帧。其部分属性简介如下: name:内嵌帧名称 width:内嵌帧宽度(可用像素值或百分比) height:内嵌帧高度(可用像素值或百分比) frameborder:内嵌帧边框 marginwidth:帧内文本的左右页边距 marginheight:帧内文本的上下页边距 scrolling:是否出现滚动条(“auto”为自动,“yes”为显示,“no”为不显示) src:内嵌入文件的地址 style:内嵌文档的样式(如设置文档背景等) allowtransparency:是否允许透明 明白了以上属性后,我们可用以下代码实现,在main.htm中把samper.htm文件的内容显示在一个高度为80、宽度为100%、自动显示边框的内嵌帧中: 〈iframe name="import_frame" width=100% height=80 src="samper.htm" frameborder=auto〉 〈/iframe〉 不错吧,马上“Ctrl+C”、“Ctrl+V”试试。 有时我们为强调页面的某项内容,想让它先于页面的其他内容显示。同样用iframe即可轻松实现: 先把要强调显示的内容另存为一个文件,如first.htm,然后通过一个预载页index.htm,内容如下: 〈meta http-equiv="refresh" content="3,url=index2.htm"〉 〈body〉 页面加载中,请稍候……〈iframe src="first.htm" style="display:none"〉〈/iframe〉 〈/body〉 主文件index2.htm 〈body〉 〈iframe src="first.htm"加入其他属性限制〉〈/iframe〉 〈/body〉 first.htm的内容就会先于页面的其他内容出现在您的浏览器里了,是不是很简单?再“Ctrl+C”、“Ctrl+V”一次? 参考资料:http://www.zahui.com/html/12/36296.htm
2023-07-20 10:32:271

iframe怎么使用?

<iframe>也应该是框架的一种形式,它与<frame>不同的是,iframe可以嵌在网页中的任意部分。我们举第一个例子,具体代码如: <iframe width=420 height=330 frameborder=0 scrolling=auto src=URL></iframe>,这里的URL可以是相对路径,也可以是绝对路径, width表示宽度,height表示宽度,可根据实际情况调整。 scrolling表示是否显示页面滚动条,可选的参数为auto、yes、no,如果省略这个参数,则默认为auto。 二、如何实现页面上的超链接指向这个嵌入的网页? 只要给这个iframe命名就可以了。方法是<iframe name=**>,例如我命名为aa,写入这句HTML语言<iframe width=420 height=330 name=aa frameborder=0 src=http://www.cctv.com></iframe>,然后,网页上的超链接语句应该写为:<a href=URL target=aa> 三、如果把frameborder设为1,效果就像文本框一样
2023-07-20 10:32:363

网页中 iframe和frame有什么区别

iframe是大的把frame包括在里面
2023-07-20 10:32:432

怎样使用iframe,在网页中插入页面

首先,我们使用DreamWeaver新建一个站点,将我们需要归纳到一个页面的网页都包含在这个站点里面。2然后我们找到一个需要嵌入页面的html文件,使用DW软件打开,找到需要插入页面的位置。3然后我们输入<iframe></iframe>标签。在前半个标签的里面,空格一下就会出现我们可以设置的属性。4我们需要设置src,即我们需要引用的页面的地址。并且,我们可以简单的设定一下我们的iframe框架的border以及是否有滚动条5除此之外,我们还应该设定这个iframe框架的宽度,一般来说我们都将其宽度设为100%,高度设为500px,由于在iframe标签内设置的宽和高都是具体值,我们需要给iframe一个class,然后设置style6这样一个iframe框架就嵌入到我们的网页当中了,我们可以按下ctrl+s,并按下F12,就可以在浏览器中查看效果图,我用红色框起来的部分就是我们嵌入的页面
2023-07-20 10:32:501

网页中为什么要少用Iframe?

但我们需要慎重的使用iframe。iframe的创建比其它包括scripts和css的 DOM 元素的创建慢了 1-2 个数量级。  使用 iframe 的页面一般不会包含太多 iframe,所以创建 DOM 节点所花费的时间不会占很大的比重。但带来一些其它的问题:onload 事件以及连接池(connection pool)。  Iframes 阻塞页面加载  及时触发 window 的 onload 事件是非常重要的。onload 事件触发使浏览器的 “忙” 指示器停止,告诉用户当前网页已经加载完毕。当 onload 事件加载延迟后,它给用户的感觉就是这个网页非常慢。  window 的 onload 事件需要在所有 iframe 加载完毕后(包含里面的元素)才会触发。在 Safari 和 Chrome 里,通过 JavaScript 动态设置 iframe 的 SRC 可以避免这种阻塞情况。  唯一的连接池   浏览器只能开少量的连接到web服务器。比较老的浏览器,包含 Internet Explorer 6 & 7 和 Firefox 2,只能对一个域名(hostname)同时打开两个连接。这个数量的限制在新版本的浏览器中有所提高。Safari 3+ 和 Opera 9+ 可同时对一个域名打开 4 个连接,Chrome 1+, IE 8 以及 Firefox 3 可以同时打开 6 个。你可以通过这篇文章查看具体的数据表:Roundup on Parallel Connections.   有人可能希望 iframe 会有自己独立的连接池,但不是这样的。绝大部分浏览器,主页面和其中的 iframe 是共享这些连接的。这意味着 iframe 在加载资源时可能用光了所有的可用连接,从而阻塞了主页面资源的加载。如果 iframe 中的内容比主页面的内容更重要,这当然是很好的。但通常情况下,iframe 里的内容是没有主页面的内容重要的。这时 iframe 中用光了可用的连接就是不值得的了。一种解决办法是,在主页面上重要的元素加载完毕后,再动态设置 iframe 的 SRC。  美国前 10 大网站都使用了 iframe。大部分情况下,他们用它来加载广告。这是可以理解的,也是一种符合逻辑的解决方案,用一种简单的办法来加载广告服务。但请记 住,iframe 会给你的页面性能带来冲击。只要可能,不要使用 iframe。当确实需要时,谨慎的使用他们。
2023-07-20 10:32:571

用iframe 在新页面打开

Iframe标记,又叫浮动帧标记,你可以用它将一个HTML文档嵌入在一个HTML中显示。它不同于Frame标记最大的特征即这个标记所引用的HTML文件不是与另外的HTML文件相互独立显示,而是可以直接嵌入在一个HTML文件中,与这个HTML文件内容相互融合,成为一个整体,另外,还可以多次在一个页面内显示同一内容,而不必重复写内容,一个形象的比喻即“画中画“电视。 现在我们谈一下Iframe标记的使用。 Iframe标记的使用格式是: <Iframe src="URL" width="x" height="x" scrolling="[OPTION]" frameborder="x"></iframe> src:文件的路径,既可是HTML文件,也可以是文本、ASP等; width、height:"画中画"区域的宽与高; scrolling:当SRC的指定的HTML文件在指定的区域不显不完时,滚动选项,如果设置为NO,则不出现滚动条;如为Auto:则自动出现滚动条;如为Yes,则显示; FrameBorder:区域边框的宽度,为了让“画中画“与邻近的内容相融合,常设置为0。 比如: <Iframe src="http://netschool.cpcw.com/homepage" width="250" height="200" scrolling="no" frameborder="0"></iframe> 二、父窗体与浮动帧之间的相互控制 在脚本语言与对象层次中,包含Iframe的窗口我们称之为父窗体,而浮动帧则称为子窗体,弄清这两者的关系很重要,因为要在父窗体中访问子窗体或相反都必须清楚对象层次,才能通过程序来访问并控制窗体。 1、在父窗体中访问并控制子窗体中的对象 在父窗体中,Iframe即子窗体是document对象的一个子对象,可以直接在脚本中访问子窗体中的对象。 现在就有一个问题,即,我们怎样来控制这个Iframe,这里需要讲一下Iframe对象。当我们给这个标记设置了ID 属性后,就可通过文档对象模型DOM对Iframe所含的HTML进行一系列控制。 比如在example.htm里嵌入test.htm文件,并控制test.htm里一些标记对象: <Iframe src="test.htm" id="test" width="250" height="200" scrolling="no" frameborder="0"></iframe> test.htm文件代码为: <html> <body> <h1 id="myH1">hello,my boy</h1> </body> </html> 如我们要改变ID号为myH1的H1标记里的文字为hello,my dear,则可用: document.myH1.innerText="hello,my dear"(其中,document可省) 在example.htm文件中,Iframe标记对象所指的子窗体与一般的DHTML对象模型一致,对对象访问控制方式一样,就不再赘述。 2、在子窗体中访问并控制父窗体中对象 在子窗体中我们可以通过其parent即父(双亲)对象来访问父窗口中的对象。 如example.htm: <html> <body onclick="alert(tt.myH1.innerHTML)"> <Iframe name="tt" src="frame1.htm" width="250" height="200" scrolling="no" frameborder="0"></iframe> <h1 id="myH2">hello,my wife</h1> </body> </html> 如果要在frame1.htm中访问ID号为myH2中的标题文字并将之改为"hello,my friend",我们就可以这样写:parent.myH2.innerText="hello,my friend" 这里parent对象就代表当前窗体(example.htm所在窗体),要在子窗体中访问父窗体中的对象,无一例外都通过parent对象来进行。 Iframe虽然内嵌在另一个HTML文件中,但它保持相对的独立,是一个“独立王国“哟,在单一HTML中的特性同样适用于浮动帧中。 试想一下,通过Iframe标记,我们可将那些不变的内容以Iframe来表示,这样,不必重复写相同的内容,这有点象程序设计中的过程或函数,减省了多少繁琐的手工劳动!另外,至关重要的是,它使页面的修改更为可行,因为,不必因为版式的调整而修改每个页面,你只需修改一个父窗体的版式即可了。 有一点要注意,Nestscape浏览器不支持Iframe标记,但在时下IE的天下,这似乎也无大碍,广泛采用Iframe标记,既为自己(网站)着了想,又为网友节省了网费,何乐而不为?
2023-07-20 10:33:041

浮动框架(iframe)与框架(frame)到底有什么区别?

转载的资料: 浅谈Iframe和FRAME的区别 一、Iframe标记的使用 提起Iframe,可能你早已将之扔到“被遗忘的角落”了,不过,说起其兄弟Frame就不会陌生了。Frame标记即帧标记,我们所说的多帧结构就是在一个浏览器窗口中显示多个HTML文件。现在,我们遇到一种很现实的情况:如有一个教程,是一节一节地上,每页末尾做一个“上一节“、“下一节“的链接,除了每节教程内容不同之外,页面其它部分内容都是相同的,如果一页一页地做笨页面,这似乎太让人厌烦了,这时突发奇想,如果有一种方法让页面其它地方不变,只将教程做成一页一页的内容页,不含其它内容,在点击上下翻页链接时,只改变教程内容部分,其它保持不变,这样,一是省时,另则以后如教程有个三长两短的变动,也很方便,不致于牵一发而动全军了;更重要的是将那些广告Banner、栏目列表、导航等几乎每页的都有的东西只下载一次后就不再下载了。 Iframe标记,又叫浮动帧标记,你可以用它将一个HTML文档嵌入在一个HTML中显示。它不同于Frame标记最大的特征即这个标记所引用的HTML文件不是与另外的HTML文件相互独立显示,而是可以直接嵌入在一个HTML文件中,与这个HTML文件内容相互融合,成为一个整体,另外,还可以多次在一个页面内显示同一内容,而不必重复写内容,一个形象的比喻即“画中画“电视。 现在我们谈一下Iframe标记的使用。 Iframe标记的使用格式是: <Iframe src="URL" width="x" height="x" scrolling="[OPTION]" frameborder="x"></iframe> src:文件的路径,既可是HTML文件,也可以是文本、ASP等; width、height:"画中画"区域的宽与高; scrolling:当SRC的指定的HTML文件在指定的区域不显不完时,滚动选项,如果设置为NO,则不出现滚动条;如为Auto:则自动出现滚动条;如为Yes,则显示; FrameBorder:区域边框的宽度,为了让“画中画“与邻近的内容相融合,常设置为0。 比如: <Iframe src="http://netschool.cpcw.com/homepage" width="250" height="200" scrolling="no" frameborder="0"></iframe> 二、父窗体与浮动帧之间的相互控制 在脚本语言与对象层次中,包含Iframe的窗口我们称之为父窗体,而浮动帧则称为子窗体,弄清这两者的关系很重要,因为要在父窗体中访问子窗体或相反都必须清楚对象层次,才能通过程序来访问并控制窗体。 1、在父窗体中访问并控制子窗体中的对象 在父窗体中,Iframe即子窗体是document对象的一个子对象,可以直接在脚本中访问子窗体中的对象。 现在就有一个问题,即,我们怎样来控制这个Iframe,这里需要讲一下Iframe对象。当我们给这个标记设置了ID 属性后,就可通过文档对象模型DOM对Iframe所含的HTML进行一系列控制。 比如在example.htm里嵌入test.htm文件,并控制test.htm里一些标记对象: <Iframe src="test.htm" id="test" width="250" height="200" scrolling="no" frameborder="0"></iframe> test.htm文件代码为: <html> <body> <h1 id="myH1">hello,my boy</h1> </body> </html> 如我们要改变ID号为myH1的H1标记里的文字为hello,my dear,则可用: document.myH1.innerText="hello,my dear"(其中,document可省) 在example.htm文件中,Iframe标记对象所指的子窗体与一般的DHTML对象模型一致,对对象访问控制方式一样,就不再赘述。 2、在子窗体中访问并控制父窗体中对象 在子窗体中我们可以通过其parent即父(双亲)对象来访问父窗口中的对象。 如example.htm: <html> <body onclick="alert(tt.myH1.innerHTML)"> <Iframe name="tt" src="frame1.htm" width="250" height="200" scrolling="no" frameborder="0"></iframe> <h1 id="myH2">hello,my wife</h1> </body> </html> 如果要在frame1.htm中访问ID号为myH2中的标题文字并将之改为"hello,my friend",我们就可以这样写: parent.myH2.innerText="hello,my friend" 这里parent对象就代表当前窗体(example.htm所在窗体),要在子窗体中访问父窗体中的对象,无一例外都通过parent对象来进行。 Iframe虽然内嵌在另一个HTML文件中,但它保持相对的独立,是一个“独立王国“哟,在单一HTML中的特性同样适用于浮动帧中。 试想一下,通过Iframe标记,我们可将那些不变的内容以Iframe来表示,这样,不必重复写相同的内容,这有点象程序设计中的过程或函数,减省了多少繁琐的手工劳动!另外,至关重要的是,它使页面的修改更为可行,因为,不必因为版式的调整而修改每个页面,你只需修改一个父窗体的版式即可了。 有一点要注意,Nestscape浏览器不支持Iframe标记,但在时下IE的天下,这似乎也无大碍,广泛采用Iframe标记,既为自己(网站)着了想,又为网友节省了网费,何乐而不为? 浮动FRAME是HTML4.0规范中的一个定义,目前的浏览器都支持它。 不象FRAMESET表示的分割区样子,一个浮动FRAME作为一个内置对象存在于Web页面上,其样式就象一个页面上的一个图形或者一个applet。浮动FRAME使用<IFRAME>标记,它具有与<FRAME>相同的大多数属性设置,包括:name、src、marginwidth、marginheight、FRAMEborder以及scrolling。同时,它还具有与图形或者applet一样的height、width和align属性。 而且,浮动FRAME遵循与普通FRAME一样的target原则:我们可以通过它的name来指向它。本原则适用于在任一类型FRAME中的浮动FRAME,反之易然。浮动FRAME中的没有traget的链接指向它本身,而_parent链接则指向包含<IFRAME>的文档所在的FRAME或者窗口。比如: <IFRAME name="floater" src="start.htm" width=150 height=200 hspace=10 align=left> <IMG src="Images/noFRAME.gif" alt="You can"t see the floating FRAME" width=150 height=200 hspace=10 align=right> </IFRAME><BR> <A href="one.htm" target="floater">Show one.htm</A><P> <A href="two.htm" target="floater">Show two.htm</A><P> <A href="start.htm" target="floater">Bring back start.htm</A> 注意,对应支持<IFRAME>标记的浏览器,任何位于<IFRAME>和</IFRAME>间的内容都将忽略。反之,其中的内容将显示出来,这可以用作解释当前浏览器不支持<IFRAME>
2023-07-20 10:33:131

JQuery设置iframe的src值

  复制代码 代码如下:   $(window.parent.document).find("#Frm_Main").attr("src",url);   使用jquery操作iframe   1 内容里有两个ifame   <iframe id="leftiframe"...   <iframe id="mainiframe..   leftiframe中jQuery改变mainiframe的src代码:   $("#mainframe",parent.document.body).attr("src"," ")   2 如果内容里面有一个ID为mainiframe的.ifame   ifame包含一个someID   you want to get this content   得到someID的内容   $("#mainiframe").contents().find("someID").html() html 或者 $("#mainiframe").contains()().find("someID").text()值   2 如上面所示   leftiframe中的jQuery操作mainiframe的内容someID的内容   $("#mainframe",parent.document.body).contents().find("someID").html()或者 $("#mainframe",parent.document.body).contents().find("someID").val()
2023-07-20 10:33:201

iframe传参

一种是:内嵌页面iframe页面; 只是内嵌页面,通过改变iframe的src上的路径参数,来写; 用watch监听$route进行操作
2023-07-20 10:33:391

frame和iframe的区别

转载的资料:浅谈Iframe和FRAME的区别一、Iframe标记的使用 提起Iframe,可能你早已将之扔到“被遗忘的角落”了,不过,说起其兄弟Frame就不会陌生了。Frame标记即帧标记,我们所说的多帧结构就是在一个浏览器窗口中显示多个HTML文件。现在,我们遇到一种很现实的情况:如有一个教程,是一节一节地上,每页末尾做一个“上一节“、“下一节“的链接,除了每节教程内容不同之外,页面其它部分内容都是相同的,如果一页一页地做笨页面,这似乎太让人厌烦了,这时突发奇想,如果有一种方法让页面其它地方不变,只将教程做成一页一页的内容页,不含其它内容,在点击上下翻页链接时,只改变教程内容部分,其它保持不变,这样,一是省时,另则以后如教程有个三长两短的变动,也很方便,不致于牵一发而动全军了;更重要的是将那些广告Banner、栏目列表、导航等几乎每页的都有的东西只下载一次后就不再下载了。 Iframe标记,又叫浮动帧标记,你可以用它将一个HTML文档嵌入在一个HTML中显示。它不同于Frame标记最大的特征即这个标记所引用的HTML文件不是与另外的HTML文件相互独立显示,而是可以直接嵌入在一个HTML文件中,与这个HTML文件内容相互融合,成为一个整体,另外,还可以多次在一个页面内显示同一内容,而不必重复写内容,一个形象的比喻即“画中画“电视。 现在我们谈一下Iframe标记的使用。
2023-07-20 10:33:461

JavaScript 怎么跨域获取 iframe 中的内容

  要解释这个问题,首先要解释两个技术点。每个“窗口”都是一个JS Runtime,即JS的运行时。如果只有一个窗口,那么就只有一个Runtime;如果一个窗口下面还有一个iframe,那么就有两个Runtime;以此类推。Runtime之间互操作(或者通信)是有跨域限制的。也就是说,如果这个窗口本身是a.baidu.com域名下的页面,那么如果这个页面下还有一个iframe,这个iframe中加载的页面是b.baidu.com域名下的。那么外层的JS。就不能跟这个iframe中的内容互操作(或者通信)。因此外层Runtime中的JS想操作内层iframe中的内容,就必须要避免跨域限制。要么内层iframe加载页面的域名跟外层是一样的。要么就是需要在内层iframe加载的页面中执行document.domain = "baidu.com";从而设置跟外层的主域相同。例如,当前页面是a.baidu.com/test.html<html><head></head><body> <iframe id="iFrm1" src = "0c893329b8c9af6ff578db9b1a128d13"margin: 0px; padding: 0px; color: rgb(69, 69, 69); font-family: arial, 宋体, sans-serif, tahoma, "Microsoft YaHei"; font-size: 14px; font-style: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-tap-highlight-color: rgba(26, 26, 26, 0.301961); -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px;">iframe中加载的页面内容如下:<html><head></head><body> <div id="innerDiv">恭喜操作到内部iframe中的元素了!!!</div> <script> document.domain = "baidu.com"; </script></body></html>在HTML5中新增了postMessage的API。可以方便窗口跟内部iframe之间进行通信,并且可以实现跨主域通信。但是有一些限制,1.老版本的浏览器一般不支持。2.父窗口只能向iframe中发送信息,iframe只能收消息,且父窗口不能直接操作iframe中的内容。3.父窗口发送的数据也是有限制的。只能发送基本数据类型或者plain object。
2023-07-20 10:33:552

iframe代码是什么意思

IFRAME 元素也就是文档中的文档,或者好像浮动的框架(FRAME)。frames 集合提供了对 IFRAME 内容的访问。就是可以在该页面内嵌子页面。下面的例子使用了 IFRAME 元素创建了包含页面 sample.htm 的框架。<IFRAME ID=IFrame1 FRAMEBORDER=0 SCROLLING=NO SRC="sample.htm"></IFRAME>
2023-07-20 10:34:031

iframe怎么通过js修改子页面的内容

var ifm= document.getElementById("ifm");ifm.onload = function(){ var subWeb = document.frames ? document.frames["ifm"].document : ifm.contentDocument; subWeb.tiao(dz);}
2023-07-20 10:34:112

页面跳转如何进入一个嵌套在Iframe中的页面中?

用iframe框架,嵌套一个网页进去即可实现;很简单的; iframe 元素会创建包含另外一个文档的内联框架(即行内框架)。 以下是iframe的属性、值、描述 align leftrighttopmiddlebottom 不赞成使用。请使用样式代替。规定如何根据周围的元素来对齐...
2023-07-20 10:34:181

iframe和frame的区别一般什么情况下使用iframe?(要具体解释,还要有案列)

■ 框架概念 : 所谓框架便是网页画面分成几个框窗,同时取得多个 URL。只需要 <FRAMESET> <FRAME> 即可,而所有框架标记需要放在一个总起的 html 档,这个档案只记录了该框架 如何划分,不会显示任何资料,所以不必放入 <BODY> 标记,浏览这框架必须读取这档 案而不是其它框窗的档案。<FRAMESET> 是用以划分框窗,每一框窗由一个 <FRAME> 标 记所标示,<FRAME>必须在 <FRAMESET> 范围中使用。如下例: <frameset cols="50%,*"> <frame name="hello" src="up2u.html"> <frame name="hi" src="me2.html"> </frameset> 此例中 <FRAMESET> 把画面分成左右两相等部分,左便是显示 up2u.html,右边则会显示 me2.html 这档案,<FRAME> 标记所标示的框窗永远是按由上而下、由左至右的次序。 本节与 Composer 教室的【运用框架】大部分相同,只是本节增加了内容及较为详细,正 如其它篇章一样并不会提及网页制作工具,若阁下学会了 HTML 相信你亦不会选用 Composer , FrontPage 一类的工具了。 ■ <FRAMESET> <FRAME> : <FRAMESET> 称框架标记,用以宣告HTML文件为框架模式,并设定视窗如何分割。 <FRAME> 则只是设定某一个框窗内的参数属性。 <FRAMESET> 参数设定: 例子:<frameset rows="90,*" frameborder="0" border=0 framespacing="2" bordercolor="#008000"> COLS="90,*" 垂直切割画面(如分左右两个画面),接受整数值、百分数, * 则代表占用馀下空 间。数值的个数代表分成的视窗数目且以逗号分隔。例如COLS="30,*,50%" 可以 切成叁个视窗,第一个视窗是 30 pixels 的宽度,为一绝对分割,第二个视窗是当 分配完第一及第叁个视窗後剩下的空间,第叁个视窗则占整个画面的 50% 宽度 为 一相对分割。您可自己调整数字。 ROWS="120,*" 就是横向切割,将画面上下分开,数值设定同上。唯 COLS 与 ROWS 两参数尽量 不要同在一个 <FRAMESET> 标记中,因 Netacape 偶然不能显示这类形的框架,尽 采用多重分割。 frameborder="0" 设定框架的边框,其值只有 0 和 1 , 0 表示不要边框, 1 表示要显示边框。(避 免使用 yes 或 no ) border="0" 设定框架的边框厚度,以 pixels 为单位。 bordercolor="#008000" 设定框架的边框颜色。颜色值请参考【调色原理】。 framespacing="5" 表示框架与框架间的保留空白的距离。 <FRAME> 参数设定: 例子:<frame name="top" src="a.html" marginwidth="5" marginheight="5" scrolling="Auto" frameborder="0" noresize framespacing="6" bordercolor="#0000FF"> SRC="a.html" 设定此框窗中要显示的网页档案名称,每个框窗一定要对应着一个网页档案。你可 使用绝对路径或相对路径,有关此两者详见於【连结进阶】 。 NAME="top" 设定这个框窗的名称,这样才能指定框架来作连结,必须但任意命名。 frameborder=0 设定框架的边框,其值只有 0 和 1 , 0 表示不要边框, 1 表示要显示边框。(避 免使用 yes 或 no ) framespacing="6" 表示框架与框架间的保留空白的距离。 bordercolor="#008000" 设定框架的边框颜色。颜色值请参考【HTML 剖析】。 scrolling="Auto" 设定是否要显示卷轴,YES 表示要显示卷轴,NO 表示无论如何都不要显示, AUTO是视情况显示。 noresize 设定不让使用者可以改变这个框框的大小,亦没有设定此参数,使用者可以很随 意地拉动框架,改变其大小。 marginhight=5 表示框架高度部份边缘所保留的空间。 marginwidth=5 表示框架宽度部份边缘所保留的空间。 以下是一些例子:(与 Composer 教室的【运用框架】相同) 例子 HTML Code <frameset rows="80,*"> <frame name="top" src="a.html"> <frame name="bottom" src="b.html"> </frameset> 例子 HTML Code <frameset rows="80,*,80"> <frame name="top" src="a.html"> <frame name="middle" src="b.html"> <frame name="bottom" src="c.html"> </frameset> 例子 HTML Code <frameset cols="150,*"> <frameset rows="80,*"> <frame name="upper_left" src="a.html"> <frame name="lower_left" src="b.html"> </frameset> <frame name="right" src="c.html"> </frameset> 例子 HTML Code <frameset rows="80,*"> <frame name="top" src="a.html"> <frameset cols="150,*"> <frame name="lower_left" src="b.html"> <frame name="lower_right" src="c.html"> </frameset> </frameset> 例子 HTML Code <frameset cols="150,*"> <frame name="left" src="a.html"> <frameset rows="80,*"> <frame name="upper_right" src="b.html"> <frame name="lower_right" src="c.html"> </frameset> </frameset> ■ <NOFRAMES> : 当别人使用的浏览器太旧,不支援框架这个功能时,他看到的将会是一片空白。为了避免 这种情况,可使用 <NOFRAMES> 这个标记,当使用者的浏览器看不到框架时,他就会看到 <NOFRAMES> 与 </NOFRAMES> 之间的内容,而不是一片空白。这些内容可以是提醒 浏览转用新的浏览器的字句,甚至是一个没有框架的网页或能自动切换至没有框架的版本 亦可。 应用方法: 在<frameset> 标记范围加入 </NOFRAMES> 标记,以下是一个例子: <frameset rows="80,*"> <noframes> <body> 很抱歉,阁下使用的浏览器不支援框架功能,请转用新的浏览器。 </body> </noframes> <frame name="top" src="a.html"> <frame name="bottom" src="b.html"> </frameset> 若浏览器支援框架,那麽它不会理会 <noframes> 中的东西,但若浏览器不支援框架,由 於不认识所有框架标记,不明的标记会被略过,标记包围的东西便被解读出来,所以放在 <noframes>范围内的文字会被显示。 ■ <IFRAME> : 这标记只适用於 IE(comet:也使用于FireFox)。 它的作用是在一页网页中间插入一个框窗以显示另一个文件。它是 一个围堵标记,但围着的字句只有在浏览器不支援 iframe 标记时才会显示,如<noframes> 一样,可以放些提醒字句之类。通常 iframe 配合一个辨认浏览器的 JavaScript 会较好,若 JavaScript 认出该浏览器并非 Internet Explorer 便会切换至另一版本。PS:一定要使用</iframe>关闭,否则后面的内容显示不出来。 <iframe> 的参数设定如下: 例子: <iframe src="iframe.html" name="test" align="MIDDLE" width="300" height="100" marginwidth="1" marginheight="1" frameborder="1" scrolling="Yes"> </iframe>src="iframe.html" 欲显示於此框窗的文件来源除档案名称,必要加上相对或绝对路径。 name="test" 此框窗名称,这是连结标记的 target 参数所需要的, align="MIDDLE" 可选值为 left, right, top, middle, bottom,作用不大 width="300" height="100" 框窗的宽及长,以 pixels 为单位。 marginwidth="1" marginheight="1" 该插入的文件与框边所保留的空间。 frameborder="1" 使用 1 表示显示边框, 0 则不显示。(可以是 yes 或 no) scrolling="Yes" 使用 Yes 表示容许卷动(内定), No 则不容许卷动。
2023-07-20 10:34:261

HTML中iFrame框架的全称

就叫iframe不是挺好的么?? 不过,在一些国人翻译的书籍里面看到过这样的名称:"浮动帧" 前面 的 i 好像是 Inline ;中文意思: 内置如果是这样的话..iframe就是内置的frame 这样好像说得通
2023-07-20 10:34:462

使用iframe和deeplink进行调端

主要方式为创建页面隐藏的iframe,将iframe append到页面元素下,将iframe的src指向页面的链接 如 intent://bact.cpc.heytapmobi.com/redpacketfallingv6/index?sign=eb53ef7&activity_id=redpacketfallingv6&bs_entry=X18&__pf__=detail&__barStyle__=0_2#Intent;scheme=https;category=android.intent.category.DEFAULT;package=com.android.browser;end 如类似的这种页面 https://dhfs.heytapimage.com/userfiles/uploads/activity_jump_page.html?redirect=https://bact.cpc.heytapmobi.com/redpacketfallingv6/index?sign=eb53ef7&activity_id=redpacketfallingv6&bs_entry=X18&__pf__=detail&__barStyle__=0_2#/index
2023-07-20 10:34:531

网页中 嵌套 iframe 优缺点

没什么用的内容就放在这里 经常用来放广告代码 JS主要是为了搜索引擎更好的爬行
2023-07-20 10:35:034

iframe网页框架有什么作用,对网站seo有影响吗?

任何东西的好坏都要结合自己本身来进行分析,没有多少定律放之四海而皆准,对于seo来说更是如此就像很多seoer第一反应就是iframe对seo有影响,但是事实并不一定是这样的为什么他们和我们换广告,不用图片加链接却用iframe网页框架结构呢?我们都知道iframe框架指文档中的文档,应该是嵌套式的结构,蜘蛛一般是抓取不到的,除非你有链接指向这个网页换广告很多人选用iframe网页框架结构有两点原因:1、iframe网页框架能给对方网站带流量只要用户浏览这个页面,对方也会记录这个浏览,而图片带连接的广告形式只有点击进去才算一个流量;2、iframe方便更新对方内容更新,这边就会显示,其中有些是内容广告iframe网页框架对网站优化到底存在什么关系呢?有没有影响呢?我想这要具体问题具体分析,为什么这么说呢?从网站建设的设计中考虑,iframe网页框架对于网站是有很大的影响的,不仅会影响蜘蛛的抓取,而且有些浏览器不支持iframe,影响用户体验,具体有多大的影响,不是很确定,建议在网站优化中尽量避免iframe架构但是从另外一个方面考虑,例如碰到的换广告位的事情,如果只是一两块小广告窗口,对于网站的影响还是很小的,而且还会有利于网站,这怎么说呢?本来换的广告位就是不让蜘蛛抓取的,如果是iframe形式,不正好符合这条件,所有iframe广告位还是有一定的作用的,如果是其他形式,还要使用nofollow属性呢!但是,是不是可以说只要不影响蜘蛛抓取的页面,都可以使用iframe网页构架呢?答案当然是否定的如果在网站优化过程中,如果实在是不让蜘蛛抓取哪个页面,可以使用其他的方法,如JS、CSS文件等等,但是如果JS、CSS文件多了的话,对于网站性能还是会有影响的
2023-07-20 10:35:171