0

私のインデックスhtml:

<html>
<head>
    <title>index</title>
    <script src="jquery.js"></script>
</head>
<body>
    <h1>Index</h1>
    <hr/>
    <iframe id="frame"></iframe>
    <hr/>
    <button id="btn">Click</button>

    <script>
    $(function(){

        window.api = {
            fun: function(){alert('index api')}
        };

        var frame = document.getElementById('frame');
        frame.src = 'frame.html';           
    });


    $('#btn').click(function(){
        $('#frame').contents().find('body').css('backgroundColor', 'red');
        $('#frame').contents().find('#btn').text('lol');
    });
    </script>

</body>
</html>

ロードされframe.htmlた JavaScriptでは、apiを介してオブジェクトにアクセスできますparent.api

api オブジェクトを frame.html ウィンドウに追加して、そこからアクセスできるようにすることはできますwindow.apiか? (ではないparent.api) (同じオリジンと異なるオリジンを考慮)?

上記のコードは機能しますが (#button背景とラベルの変更など)、これらのドキュメントがすべて私の PC にある (同じオリジン) ためだと思います。私は正しいですか?

4

1 に答える 1