在Javascript中从其他帧访问帧的元素_Javascript_Jquery_Html_Frames

在Javascript中从其他帧访问帧的元素

javascript jquery html

在Javascript中从其他帧访问帧的元素,javascript,jquery,html,frames,Javascript,Jquery,Html,Frames,如何从其他框架访问框架的元素。例如： Main.html： <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> </head> <frameset rows="33%,33%,*"> <frame class=

如何从其他框架访问框架的元素。例如：

Main.html：

<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    </head> 
    <frameset rows="33%,33%,*">
        <frame class="fra" src="frame1.html"/>
        <frame class="fra" src="frame2.html"/>
    </frameset>
</html>

它将错误显示为：

未捕获的TypeError:无法读取未定义的属性“document”

因此，window.frames[0]本身未定义

.有人能帮我解决这个问题吗？

你应该在你的iFrame上添加id，比如iframe1和iframe2

    <frame class="fra" src="frame1.html" id="frame1" />
    <frame class="fra" src="frame2.html" id="frame2" />

应该允许您从iframe2访问第一帧中id为para的元素

$window.parent.document将允许您从iframe2返回主文档，然后找到iframe1，然后内容将允许您进入iframe1，在其中可以找到para元素。

由于安全性，使用parent访问parent，然后浏览器将阻止其他帧的操作，请参阅此可能的重复项

<html>
    <HEAD>
        <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    </HEAD>
    <body>
        <b><p id="para"> This is frame two.html </p></b>
        <button id="but"> Get data </button>
        <script>
            $(document).ready(function(){
                $("#but").click(function(){
                    alert(window.frames[0].document.getElementById('para'));
                });
            });
        </script>
    </body>
</html>

    window.frames[0].document.getElementById('para')

    <frame class="fra" src="frame1.html" id="frame1" />
    <frame class="fra" src="frame2.html" id="frame2" />

$(window.parent.document).find("#iframe1").contents().find("#para")