在开发日常中，时常遇到这样的页面。
以微信公众平台为例，这样的页面在左面设置了导航的功能，点击后会在右侧容器中显示其代指的页面。
本次记录的仅仅是众多解决方案中的一种。利用iframe实现内嵌页面的跳转。
index1.html
<html lang="en"><head> <meta charset="UTF-8"> <title>根页面title> <script> function changeSrc1(){ document.getElementById("iframe1").setAttribute("src","1.html"); } function changeSrc2(){ document.getElementById("iframe1").setAttribute("src","2.html"); }script>head><body><div> <button id="btn-sub1" href="1.html" target="iframe1" onclick="changeSrc1()">切换到页面一button> <button id="btn-sub2" href="2.html" target="iframe1" onclick="changeSrc2()">切换到页面二button> <a href="1.html" target="iframe1">切换到页面一a> <a href="2.html" target="iframe1">切换到页面二a>div><div> <iframe name="iframe1" id="iframe1" src="1.html"> iframe>div>body>html>分析：利用JavaScript的onclick方法来进行动态的给绑定的iframe DOM容器更换内嵌页面。
1.html
<html lang="en"><head> <meta charset="UTF-8"> <title>根目录title>head><body><div> <h1>页面一h1>div>body>html>2.html
<html lang="en"><head> <meta charset="UTF-8"> <title>根目录title>head><body><div> <h1>页面二h1>div>body>html>
最后，祝大家变得更强！
4340
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
