iframe中镶嵌html页,并获取html页中的方法
首先创建两个html页
第一个html页(HtmlPage1.html)
<html> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript"> //传值 function GetString() { var Str = "{\"Num\": \"" + document.getElementById("Num").value + "\"}"; return Str; } </script> </head> <body> 值:<input type="text" id="Num" style="width:40px;text-align:center;"> </body> </html>
第二个html页(HtmlPage2.html)
<html> <head> <meta charset="utf-8" /> <title></title> <script> window.onload = function () { //必须先加载html页,不然造成第一个html页中的函数不存在 document.getElementById("Plugin").src = "HtmlPage1.html"; } //点击 function Funbtn() { var Num = document.getElementById("Plugin").contentWindow.GetString();//获取Iframe中html页中的方法 alert(Num); } </script> </head> <body> <iframe id="Plugin" frameborder="1" noresize="noresize" name="plugin" style="width: 520px; height: 140px;"></iframe><br /> <button id="btn" onclick="Funbtn()">按钮</button> </body> </html>
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步