jquery - How to access div element by jquery on iframe?

Question

How to access div element by jquery on iframe?

I tried this (jsFiddle)

<script>

    var ifr = $("#ifr");

    $("#ifr").load(function () {
        alert($("#ifr").contents().find('#test').html());
    });

    $("#ifr").attr('src', 'http://meoooh.raonnet.com/test/oh.html');

</script>
<iframe id="ifr" width="560" height="315"></iframe>

And

I get a undefined alert.

Why I can't access div element?

Answer 1

Why I can't access div element?

For security reasons. You can only access DOM elements of a child iframe if this iframe is pointing to the same domain as the parent page. In the example you have shown the parent page is hosted on jsfiddle.net whereas the src property of your iframe if pointing to meoooh.raonnet.com which are 2 different domains and browsers do not allow you to do that. Only if the 2 domains are the same you can access elements inside the iframe.

Answer 2

Chrome 在控制台中返回以下错误：

阻止来源为“ http://fiddle.jshell.net ”的框架访问来源为“ http ://meooo​​h.raonnet.com”的框架。协议、域和端口必须匹配。