首页只需要一个内嵌框对三个本地网页进行切换，留三个本地html地址接口

只需要一个内嵌框对三个本地网页进行切换，留三个本地html地址接口

时间: 2024-04-14 21:28:39 浏览: 151

<!DOCTYPE html> <html> <head> <style> .iframe-container { position: relative; width: 100%; height: 0; padding-bottom: 56.25%; /* 16:9 aspect ratio */ } .iframe-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none; } </style> </head> <body> <button onclick="showPage('page1.html')">Page 1</button> <button onclick="showPage('page2.html')">Page 2</button> <button onclick="showPage('page3.html')">Page 3</button> <div class="iframe-container"> <iframe id="pageFrame" src=""></iframe> </div> <script> function showPage(pageURL) { var frame = document.getElementById('pageFrame'); frame.src = pageURL; } </script> </body> </html> 这段代码只使用了一个内嵌框来切换三个本地网页。通过点击按钮触发`showPage`函数，并传入相应的本地HTML地址作为参数。在函数内部，我们获取到id为"pageFrame"的iframe元素，并将其src属性设置为传入的页面URL，从而实现在同一个内嵌框中切换不同的本地网页。请记得将按钮对应的本地HTML地址作为参数传入函数。

阅读全文