[javascript] jQuery / JavaScript : iframe의 내용에 액세스

jQuery를 사용하여 iframe 내부의 HTML을 조작하고 싶습니다.

jQuery 함수의 컨텍스트를 iframe의 문서로 설정 하여이 작업을 수행 할 수 있다고 생각했습니다.

$(function(){ //document ready
    $('some selector', frames['nameOfMyIframe'].document).doStuff()
});

그러나 이것은 작동하지 않는 것 같습니다. 에서 변수가 검사 쇼 날의 비트 frames['nameOfMyIframe']입니다 undefined내가 부하에 iframe을 위해 잠시 기다려하지 않는. 그러나 iframe 이로 드되면 변수에 액세스 할 수 없습니다 ( permission denied유형 오류가 발생 함).

누구든지 이것에 대한 해결 방법을 알고 있습니까?



답변

나는 당신이하고있는 일이 동일한 원산지 정책의 대상이라고 생각합니다 . 권한 거부 유형 오류가 발생 하는 이유 입니다.


답변

<iframe>도메인이 동일한 도메인 인 경우 다음 과 같이 요소에 쉽게 액세스 할 수 있습니다.

$("#iFrame").contents().find("#someDiv").removeClass("hidden");

참고


답변

.contents()jQuery의 메소드를 사용할 수 있습니다 .

.contents()iframe을 메인 페이지와 같은 도메인에있는 경우 방법은 또한, iframe이 내용 문서를 가져올 수 있습니다.

$(document).ready(function(){
    $('#frameID').load(function(){
        $('#frameID').contents().find('body').html('Hey, i`ve changed content of <body>! Yay!!!');
    });
});


답변

iframe src가 다른 도메인에서 온 경우에도 계속 수행 할 수 있습니다. 외부 페이지를 PHP로 읽고 도메인에서 에코해야합니다. 이처럼 :

iframe_page.php

<?php
    $URL = "http://external.com";

    $domain = file_get_contents($URL);

    echo $domain;
?>

그런 다음과 같은 것 :

display_page.html

<html>
<head>
  <title>Test</title>
 </head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>

<script>

$(document).ready(function(){   
    cleanit = setInterval ( "cleaning()", 500 );
});

function cleaning(){
    if($('#frametest').contents().find('.selector').html() == "somthing"){
        clearInterval(cleanit);
        $('#selector').contents().find('.Link').html('ideate tech');
    }
}

</script>

<body>
<iframe name="frametest" id="frametest" src="http://yourdomain.com/iframe_page.php" ></iframe>
</body>
</html>

위는 액세스 거부 등이없는 iframe을 통해 외부 페이지를 편집하는 방법의 예입니다.


답변

나는이 방법을 더 깨끗하게 발견한다.

var $iframe = $("#iframeID").contents();
$iframe.find('selector');


답변

사용하다

iframe.contentWindow.document

대신에

iframe.contentDocument


답변

이벤트를 iframe의 onload 핸들러에 첨부하고 거기에서 js를 실행하여 iframe에 액세스하기 전에로드가 완료되었는지 확인해야합니다.

$().ready(function () {
    $("#iframeID").ready(function () { //The function below executes once the iframe has finished loading
        $('some selector', frames['nameOfMyIframe'].document).doStuff();
    });
};

위의 내용은 ‘아직로드되지 않은’문제를 해결하지만 권한과 관련하여 다른 도메인의 iframe에서 페이지를로드하는 경우 보안 제한으로 인해 페이지에 액세스 할 수 없습니다.