阿萌的程序小屋

萌物控重度患者与您一起畅游技术与梦想的世界

利用超链接或JavaScript修改iframe框架内嵌网页地址

Iframe标签是我们常用的功能之一,它能在网页中显示一个指定的网页,实现页中页的效果,今次阿萌来介绍两种改变iframe框架中src网址的方法。

本次介绍的两种方法分别是(方法不止两种,本文只介绍两种):
1、利用超链接来改变iframe框架中src属性。
2、利用javascript构建一个函数,然后通过onclick来调用。

方法原理没啥可说的,就当做固定事项来记吧。

一、利用超链接。

格式:<a href="跳转的地址" target="iframe中的name属性">链接名称</a>


<iframe width="400" height="300" src="" name="iframename" id="iframeid"></iframe>
<a href="http://www.baidu.com/" target="iframename">百度</a>
<a href="http://www.google.com/" target="iframename">谷歌</a>
<a href="http://www.wangmengyu.cn/" target="iframename">阿萌</a>


 

二、利用JS

这里请注意下与超链接的区别,利用的是ID,而不是name。


<iframe width="400" height="300" src="" name="iframename" id="iframeid"></iframe>
<script language="JavaScript">
function cSrc(u)
{
  document.getElementById("iframeid").src=u;
}
</script>
<input type="button" value="百度" onclick="cSrc('http://www.baidu.com/')">
<input type="button" value="谷歌" onclick="cSrc('http://www.google.com/')">
<input type="button" value="阿萌" onclick="cSrc('http://www.wangmengyu.cn/')">


 

如有朋友感觉我的博文或代码有问题,愿能给予我宝贵的意见!Thanks

另注:转载请随意,但请带上本文地址,万分感谢。

http://www.wangmengyu.cn/?p=459

这就是真的真的是传说中的公告牌的说~~
暂且努力发展中~~

性别:男  年龄:20岁
现居:江苏  南京  浦口区
标语:萌即是一切