Javascript 基于innerHTML删除HTML元素

我正在尝试让这个谷歌浏览器扩展只在后台运行，最终用户不需要与之交互，不需要点击任何选项。假设网页中有如下元素

<tr>
    <td class="chart">
       <a>Intel Xeon Silver 4123 @ 3.00GHz</a>
    </td>
</tr>

代码文档.getElementsByCassName'chart'返回一个非DOM的值。您必须循环数组中的每个元素，即：

var charts = document.getElementsByClassName('chart');
if(charts.length) {
    for(var i=0; i<charts.length; i++) {
        if(charts[i].tagName === 'TD' && charts[i].innerHTML.includes('Xeon')) {
            charts[i].parentNode.style.display = 'none';
        }
    }
}

另请注意：

它是复数元素，而不是getElementByClassName单数元素。 它不是String.contains 您可能希望使用来隐藏整行

---

您不能只设置要删除的元素的id吗？代码文档。getElementsByClassName'chart'返回一个HTMLCollection[]而不是DomeElement。您必须循环数组中的每个元素，即：document.getElementsByClassName'chart'[0]。innerHTML。包含'Xeon'。仍然不起作用。在扩展中使用代码之前，您可能应该在浏览器控制台中检查它是否起作用，或者保存网页，然后将您自己的JavaScript添加到页面中。对于google chrome扩展，这是否必须进入content.js或background.js？我尝试将代码放入这两个文件中，但它没有做任何事情。它是String.includes而不是String.contains。它似乎是在删除所有行，而不是将这些行与Xeonth匹配。第一个匹配是，所以您的代码在第一个匹配上替换了整个内容。从var i=1启动for循环就可以做到这一点。顺便说一句，非常感谢。一切都很顺利。

var charts = document.getElementsByClassName('chart');
if(charts.length) {
    for(var i=0; i<charts.length; i++) {
        if(charts[i].tagName === 'TD' && charts[i].innerHTML.includes('Xeon')) {
            charts[i].parentNode.style.display = 'none';
        }
    }
}