使用jQuery删除iframe中的body标签
Posted
技术标签:
【中文标题】使用jQuery删除iframe中的body标签【英文标题】：Remove body tag within iframe with jQuery 【发布时间】：2016-01-26 04:59:54 【问题描述】：我想从包含在 WooCommerce (http://www.shapur.com/product-category/fp-journe/) 中的 prettyPhoto 灯箱插件中的 iframe 中删除不必要的标题。当您单击该页面底部的单个产品按钮时，它应该删除 iframe 中包含的 body 标记。 iframe 符合同源策略，所以不是这样。
我在同一域上创建了一个测试页面，效果很好：http://www.shapur.com/test.php。
与灯箱有冲突吗？我只是不明白。感谢您的帮助。
这是测试页面的代码：
<!DOCTYPE html>
<html>
<body>
<iframe id="myframe" src="http://shapur.com/index.php"></iframe>
<p>Click the button to change the style of the body tag contained in the iframe.</p>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction()
var x = document.getElementById("myframe");
var y = x.contentDocument;
y.body.style.display = "none";
</script>
</body>
</html>
【问题讨论】：
iframe 内容在具有 iframe 的页面的 DOM 中不可见，因此您无法更改它。要删除它，您需要在托管的页面上触发事件通过 iframe。 需要确保 iframe 先加载 @DinoMyte 在测试页面 (shapur.com/test.php) 我能够在 iframe 中托管的页面上触发事件。 【参考方案1】：既然同源，何不使用jQueryload()函数：
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript">
function myFunction()
$(".myDiv").load("/index.php",function(data)
$(data).find('body').css("display","none");
);
</script>
还有一个空的：
<div class="myDiv"></div>
这样，您可以更轻松地玩弄代码。
【讨论】：
听起来是个好建议。 Ajax 是 Wordpress 核心的一部分，不知道我将如何在上面的测试页面中实现它。我尝试使用上面的代码，但它不起作用。 糟糕，我的意思是说 jQueryload() 函数伙伴！我的错！和Ajax is a functionality of jQuery。如果它不起作用，您可以在代码顶部包含谷歌的 jQuery 库（请参阅编辑的代码）。如果您遇到任何其他错误，请告诉我。以上是关于使用jQuery删除iframe中的body标签的主要内容，如果未能解决你的问题，请参考以下文章