删除或隐藏iframe内的内容

时间:2016-07-09 18:53:17

标签: javascript jquery iframe

为什么我无法在iframe中隐藏此内容:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>contents demo</title>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>

<iframe src="//api.jquery.com/" width="80%" height="600" id="frameDemo"></iframe>

<script>
$('#frameDemo').contents().find('#logo-events').hide();
</script>

</body>
</html>

为什么这不起作用?

感谢。

2 个答案:

答案 0 :(得分:3)

这是因为iframe的内容与父页面位于不同的域中。浏览器安全逻辑会停止父级尝试修改跨域内容。

这是无法避免的。

答案 1 :(得分:0)

@Rory McCrossan是对的。

我能想到的唯一解决方法是在您自己的域上创建另一个页面,加载api.jquery.com的内容,然后让iframe的src指向您创建的新页面。

E.g。创建一个名为jqueryApi.php的页面,其中包含以下PHP代码

<?php
    $contents = file_get_contents('http://api.jquery.com/');
    echo $contents;
?>

然后将iframe代码设为<iframe src="jqueryApi.php" width="80%" height="600" id="frameDemo"></iframe>

相关问题