如何檢查HTML元素是否沒有用JavaScript面對用戶的數據（例如文本或圖片）？

Question

我有一個Web應用程序，可從網頁中刪除某些元素，因此在完成初始遍歷后，我想刪除所有用於包含不再包含的數據的div。 因此，例如，在初始傳遞之后，一個元素可能看起來像這樣：

<div class = "some-random-class">
    <script> *script stuff* </script>
    <div class = "some-other-class"> 
        <p>  </p>
    </div>
</div>

我希望能夠檢測到“ some-random-class”的div不再包含任何文本（或者該文本僅是空白），圖片或視頻，並且僅包含用於格式化或間隔的元素。 例如，此鏈接顯示僅由div和腳本組成的網頁中的兩個空白框。

Answer 1

這里是。 如果類名稱為“ some-other-class”並且為空，則將其刪除。 您可以更改var elements = document.getElementsByTagName('div'); 到var elements = document.getElementsByTagName('*'); 如果您需要所有標簽，或將其更改為任何其他標簽。 如果您想刪除任何沒有元素名稱的空元素，也可以刪除elements[i].className == "some-other-class" && 。

 var elements = document.getElementsByTagName('div'); for (var i = 0; i < elements.length; i++) { if (elements[i].className == "some-other-class" && elements[i].innerText.replace(" ","") == "" && elements[i].innerHTML.indexOf('<img') < 0 && elements[i].innerHTML.indexOf('<video') < 0){ elements[i].parentElement.removeChild(elements[i]); } } 

 <div class = "some-random-class"> <div class = "some-other-class"> <p> a </p> </div> <div class = "some-other-class"> <p> <img src="https://www.w3schools.com/tags/smiley.gif"> </p> </div> <div class = "some-other-class"> <p> </p> </div> </div>