19

我正在尝试删除文档中的 iFrame 标签。这就是功能。但它似乎不起作用。这是我的示例代码

<script>
function removeiframe() {
            alert("Hello Lovely World");
            var markup = document.body.innerHTML;
            
            var filtered=markup.replace(/(<iframe.*?>.*?<\/iframe>)/g,"");
            alert("he: " + markup);
//markup = Regex.Replace(markup, @"<script.*?/script>", "", RegexOptions.IgnoreCase);
//markup = Regex.Replace(markup, @"<iframe.*?/iframe>", "", RegexOptions.IgnoreCase);
markup = filtered;
document.body.innerHTML = markup + "<hr><hr>HELLO";
        }
</script>
<body onload="removeiframe()">
    
        <iframe marginheight="0" src="http://www.hotelanswer.com" marginwidth="0" frameborder="0" height="180" scrolling="no" width="210"></iframe><br>
</body>
4

5 回答 5

31

这是一个您可以运行的脚本，它将从您的文档中删除所有 iframe。这是这个工作的一个例子：http: //jsfiddle.net/5hh9H/

var iframes = document.querySelectorAll('iframe');
for (var i = 0; i < iframes.length; i++) {
    iframes[i].parentNode.removeChild(iframes[i]);
}
于 2013-02-27T03:23:53.400 回答
6

您没有提到为什么需要在文档中删除 iframe。

我这样做是为了防止点击劫持攻击。但它在任何情况下都有效。

你需要这个：

<style id="defendClickjack" type="text/css">body{display:none;}</style>

进而

<script type="text/javascript">
    if (self === top) {
        var defendClickjack = document.getElementById("defendClickjack");
        antiClickjack.parentNode.removeChild(defendClickjack);
    }
    else {
        top.location = self.location;
    }
</script>

您可以在这里找到更多信息：

于 2013-02-27T06:24:20.977 回答
6

纯Javascript代码：

document.querySelectorAll('iframe').forEach(
  function(elem){
    elem.parentNode.removeChild(elem);
});
于 2019-01-13T12:34:42.233 回答
3

如果您只想在移动设备上执行此操作，请在此处对Matt 的原始示例进行轻微改进。对我来说，用例是我在我的网站上使用嵌入的 Vimeo 来创建视频背景。我需要放弃移动设备上的视频以获得性能。这可以完成工作。

$( document ).ready(function() {      
    let isMobile = window.matchMedia("only screen and (max-width:650px)").matches;
        if (isMobile) {
            var iframes = document.querySelectorAll('iframe');
            for (var i = 0; i < iframes.length; i++) {
            iframes[i].parentNode.removeChild(iframes[i]);
            }
        }
    });

s.ermakovich 关于代码无法在多个 iframe 上正常工作的评论并不是“错误”，而是有点误导......并且取决于具体情况。我的 Vimeo iFrame 有一个子框架在 DOM 完成后继续发出请求。马特的代码确实摧毁了两者。

在我的情况下，我的第二个 iframe是parent的直接孩子。如果页面上有多个 iframe 不是同一父级的直接子级，并且您只是复制并粘贴该代码，则该代码可能不起作用。在这种情况下，您需要更具体：

如果您的页面上有多个 iFrame，您可以为查询选择器添加特异性。您根据情况选择是否要使用 querySelectorAll()，但我认为没有任何理由不能使用 querySelector()。

document.querySelector(".foo > bar iframe")
document.querySelector("foo bar > iframe")

如果你有一个 iframe 网格，可能有几个嵌入的视频连续

document.querySelectorAll("foo > .bar > iframe")

或者可能来自相同的数据源更好......

document.querySelectorAll("iframe[data-src]")

如果我在某个地方错了，请有人纠正我

于 2021-04-16T18:11:27.600 回答
0

您应该将 iframe 放在 div 元素内。

<div id="kk">
  //your iframe
</div>

然后使用 jQuery 删除 iframe。

$('#kk').click(function(){
   $(this).html("");
});

这是一个可能的解决方案。

于 2013-02-27T03:20:17.653 回答