使用CSS或JavaScript從iframe中的網頁中刪除所有圖像

我想要刪除要在包含刷新的iframe的HTML文件上顯示的所有圖像。
是否有可能使用CSS或JavaScript的方法？使用CSS或JavaScript從iframe中的網頁中刪除所有圖像

加載iframe的頁面使用下面的代碼。

function reloadIFrame() { 
 
    console.log('reloading..'); 
 
    document.getElementById('iframe').contentWindow.location.reload(); 
 
} 
 

 
window.setInterval(reloadIFrame, 3000);

body { 
 
    margin: 0px; 
 
} 
 
h1 { 
 
    font-family: arial; 
 
    font-size: 50%; 
 
} 
 
iframe { 
 
    width: 100%; 
 
    height: 800px; 
 
} 
 
div.top { 
 
    background-color: rgba(2, 109, 8, 0.83); 
 
    height: 1%; 
 
    width: 100%; 
 
}

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <link rel="shortcut icon" href="news.png" type="image/x-icon" /> 
 
    <title>Chat</title> 
 
</head> 
 
<body> 
 
    <div class="top"> 
 
    <img src="news.png" alt="newsicons" height="31" width="31"> 
 
    <h1>News</h1> 
 
    </div> 
 

 
    <iframe id="iframe" src="http://www.bbc.com/news/world"></iframe> 
 
</body> 
 
</html>

來源

2017-08-30 user98734

您可以用javascript做到這一點。檢查下面更新片斷..

if(document.getElementById('iframe')) { 
 
    var images = document.getElementsByTagName('img'); 
 
    for (i = 0; i < images.length;i++) { 
 
    images[i].style.display = "none"; 
 
    } 
 
}

<div class="top"> 
 
     <img src="news.png" alt="newsicons" height="31" width="31"> 
 
     <h1>News</h1> 
 
    </div> 
 

 
    <iframe id="iframe" src="http://www.bbc.com/news/world"></iframe>

來源

2017-08-30 07:56:26

我覺得這可能無法正常工作，由於跨域政策。如果iframe源在同一個域上，它應該可以工作。 – nivincp

相同的來源策略不會對此代碼產生任何影響：它不會嘗試訪問框架中的文檔。 – Quentin

@Quentin true，但假設它將訪問iframe html內容.. :-) – nivincp

使用CSS或JavaScript從iframe中的網頁中刪除所有圖像

回答

相關問題