將iframe中的html文件元素添加到原始文件的DOM樹中

我有test.php包含iframe的文件，該文件從iframe.html獲取時點擊按鈕click單擊。將iframe中的html文件元素添加到原始文件的DOM樹中

但是我想在裏面IFRAME（iframe.html），但沒有發生文件的元素運用一些JavaScript代碼，這裏是我的代碼：

tesp.php文件：

<html> 
<head> 
    <title>test</title> 
</head> 
<body> 
<input type="button" value="Click" id="fill_iframe"/> 
<br> 
<iframe id="iframe" src="" style="width: 200px; height: 100px">hello</iframe> 
<br> 
<div class="front"> 
    <a href="#">outside frame</a> 
</div> 
<br> 
<input type="button" value="change color" id="log"/> 
<script src="https://code.jquery.com/jquery-3.1.1.js"></script> 
<script> 
    $("#fill_iframe").click(function() { 
    $("#iframe")[0].src = "iframe.html"; 
    }); 
    $("#log").click(function() { 

    $('.front a').css('color', 'red'); 
    console.log($("#iframe")); 
    }); 

</script> 
</body> 
</html>

和iframe.html文件：

<html> 
    <head> 

    </head> 
    <body> 
     <div class="front"> 
     <a href="#">inside frame</a> 
     </div> 

    </body> 
</html>

當我點擊change color按鈕時，只有外部鏈接被更改。

而當我用console.log($("#iframe"));，它沒有孩子？這是爲什麼？

我錯過了什麼？

我甚至試圖用$("#iframe").load("iframe.html");沒有提前:)

來源

2017-01-15 wael razouk

你需要得到iframe的文檔內改變

感謝。在jQuery中您可以使用

jQuery("#iframe").contents().find(".front a").css("color", "red");

來源

2017-01-15 19:44:30 Rafael

非常感謝主席先生爲此:) 它的工作 –

@waelrazouk歡迎您:) – Rafael

將iframe中的html文件元素添加到原始文件的DOM樹中

回答

相關問題