Question

我在页面上有一个按钮。单击时，将打开一个iframe。 iframe和按钮都有不同的来源。加载iframe时，我需要从其代码中获取该iframe的数据ID。

我刚刚尝试过

window.onload = function() {

  var ifr=document.getElementById('iframe_test');
    ifr.onload=function(){
        this.style.display='block';
        console.log($("#iframe_test").data("id"));
    };
}

它仅返回：undefined作为输出。

Answer 1

要求：

<script src="http://code.jquery.com/jquery-2.2.4.min.js"></script>

Javascript：

$(function() {
    $("#iframe_test").load(function(){
        $(this).style.display='block';
        console.log($("#iframe_test").data("id"));
    });
})

HTML：

<body>
<iframe id='iframe_test' data-id='ddc' src='http://whatever.com'></iframe>
</body>

Chrome控制台结果：

ddc

Answer 2

通过使用Javascript，您可以使用window.onload执行以下操作：

var iframes= parent.document.getElementsByTagName("iframe")[0];
console.log(iframes.getAttribute("data-id"))

下面是一个演示：

<html>
    <head>
        <title>sample</title>
        <script type="text/javascript">
            window.onload = function() {

                var iframes= parent.document.getElementsByTagName("iframe")[0];
                alert(iframes.getAttribute("data-id"))
            }
        </script>
    </head>
    <body>
        <iframe id='iframe_test' data-id='foo' src='http://example.com'></iframe>
    </body>
</html>

如何从iframe代码获取数据ID值？

2 个答案: