如何检查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>