如何检查HTML元素是否没有用JavaScript面对用户的数据（例如文本或图片）？

Question

I have a web application that removes certain elements from a webpage, so after it is done with the initial pass, I want to remove all divs that used to contain data that no longer do. So for example, after the initial pass, an element might look like this:

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

Where I want to be able to detect that the div with "some-random-class" no longer contains any text (or the text is only whitespace), pictures, nor video, and only contains elements that are used for formatting or spacing. For example, this link shows two empty boxes in a webpage made up with only divs and scripts.

Answer 1

Here it is. If it has class name "some-other-class" and is empty then it will be deleted. You can change var elements = document.getElementsByTagName('div'); to var elements = document.getElementsByTagName('*'); if you want all tags, or change it to any other tag. Also you can remove elements[i].className == "some-other-class" && if you want to delete any element that is empty even without having that class name.

 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>