父页面内获取获取iframe内的变量或者是获取iframe内的值

前提:页面不可跨域访问,必须同一域名下,否则返回值为空

父页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <style>

    iframe{
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height:80%;
            bottom: 80%;
        }
        .read{
            position: absolute;
            bottom: 0;
            width: 100%;
            height: 20%;
        }

    </style>
</head>
<body>
    <!-- <iframe id="index" name="index" src="http://daogou.qionglegou.com/index.php?r=p/d&id=17331579&source=1l" frameborder="0"></iframe> -->
    <iframe id="index" name="index" src="/content.html" frameborder="0"></iframe>
    <script>
        $(function(){
            var oFrm = document.getElementById('index');
            oFrm.onload = oFrm.onreadystatechange = function () {
                if (this.readyState && this.readyState != 'complete') {
                    //alert("加载中。。。");
                }
                else {
                    var dom =$(window.frames["index"].document).find(".goods_reco").data('datasid');
                    console.log(dom)
                    var c = $('#index')[0].contentWindow;
                    console.log(c.goodsItem.goodsid);

                }
            }
        })
    </script>
</body>
</html>

子页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
    <div class="goods_reco" data-datasid='123456'>1111111111</div>
    <script>
        var goodsItem = {goodsid:'123312312'};
    </script>
</body>
</html>

猜你喜欢

转载自www.cnblogs.com/NB-JDzhou/p/10019090.html