怎么使用js换掉iframe里面的src路径
比如点了一个html按钮以后就换掉<iframe class="embed-responsive-item" src="HtmlPage1.html"></iframe>里面src路径使之显示另外一个页面的内容（可以引用一个JQ脚本，如 <script src="js/jquery-1.8.2.min.js"></script>）
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<style>
#buttonA {
display: block;
width: 120px;
height: 35px;
background-color: gray;
line-height: 35px;
text-align: center;
}
#buttonA:hover{
color:white;
background-color: black;
cursor:pointer;
}
</style>
<!-- <script type="text/javascript" src="js/jquery1.11.3.js"></script>-->
</head>
<body>
<a id="buttonA" >Click</a>
<iframe id="testFrame" src="http://www.baidu.com" width="100%" height="500"></iframe>
<script>
/*$(document).ready(function(){
$("#buttonA").click(function(){
$("#testFrame").attr("src","http://www.sina.com.cn");
});
});*/
window.onload=function(){
var button=document.getElementById("buttonA");
var iframe=document.getElementById("testFrame");
button.onclick=function(){
console.log(iframe);
iframe.src="http://www.sina.com.cn";
};
};
</script>
</body>
</html>
<html>
<head>
<meta charset="utf-8"/>
<style>
#buttonA {
display: block;
width: 120px;
height: 35px;
background-color: gray;
line-height: 35px;
text-align: center;
}
#buttonA:hover{
color:white;
background-color: black;
cursor:pointer;
}
</style>
<!-- <script type="text/javascript" src="js/jquery1.11.3.js"></script>-->
</head>
<body>
<a id="buttonA" >Click</a>
<iframe id="testFrame" src="http://www.baidu.com" width="100%" height="500"></iframe>
<script>
/*$(document).ready(function(){
$("#buttonA").click(function(){
$("#testFrame").attr("src","http://www.sina.com.cn");
});
});*/
window.onload=function(){
var button=document.getElementById("buttonA");
var iframe=document.getElementById("testFrame");
button.onclick=function(){
console.log(iframe);
iframe.src="http://www.sina.com.cn";
};
};
</script>
</body>
</html>
温馨提示：内容为网友见解，仅供参考
第1个回答 推荐于2017-11-25
给iframe一个id，获取iframe内部的src值，然后替换本回答被网友采纳
相似回答
