不同浏览器根据超链接的target属性查找iframe

iframe加载超链接内容

最新推荐文章于 2022-11-13 14:15:18 发布

原创最新推荐文章于 2022-11-13 14:15:18 发布 · 2.1k 阅读

1 ·

CC 4.0 BY-SA版权

Web前端专栏收录该内容

1 篇文章

订阅专栏

本文探讨了不同浏览器下iframe加载超链接内容的行为差异。通过设置iframe的name和id属性，研究了Firefox、IE11及Google Chrome在不同配置下加载新页面的表现。

1，情景：

点击超链接，在iframe中显示加载的新页面，超链接的target写iframe的id或者name属性。

2，浏览器

IE11，

GoogleChrome31，

FireFox47

3，部分页面代码：

<div id="headdiv"  >
	<ul id="headtitle" >
		<li><a  href="mainpage!list.do"   target="fm1">首页</a></li>
		<li><a  href="fee!list.do"    target="fm1">账目</a></li>		
		<li><a  href="javascript:void(0)"   target="fm1" >记事本</a></li>
		<li><a  href="about:blank"  target="fm1" >留言板</a></li>
	</ul>
</div>

<div id="contentdiv">
	
	<iframe name="fm1" id="fm1" frameborder="1">Not support iframe?</iframe>
</div>

结论：

1，当iframe没有name属性仅有id属性时，firefox和ie都找不到iframe，点击任何超链接，都打开了新的标签页/窗口，但googlechrome能根据id找到iframe并在其中显示新页面；

2，当iframe仅有name属性时，3种浏览器都能找到iframe，能在iframe中显示新页面；