Question

我正在尝试使用JS从我的FE环境中删除空的H1标签。在我将其删除后，漫游器和爬虫程序仍会看到这些标记=它们仍然可以通过Page Source看到，它们的DOM节点也已加载。

是否可以从DOM中完全删除一个元素？

我的html是这样的：

<a href="/link"><img src="banner.jpg" title="Title" />
  <h1 class="nivo-h1-title">
    <span></span>
  </h1>
</a>

首先我尝试了jQuery方法：

$( document ).ready(function() {
    $( ".nivo-h1-title" ).remove();
});

通过这种方式，元素将从最终HTML中删除，但是当您通过“页面源”查看页面时，这些元素仍然存在，而机械人/爬虫者仍然可以看到它们。我做了很多研究，并尝试使用来自此链接Remove all child elements of a DOM node in JavaScript的代码的纯Javascript方法-带有parentNode的removeChild：

var elements = document.getElementsByClassName('nivo-h1-title');
while(elements.length > 0){
        elements[0].parentNode.removeChild(elements[0]);
}

但是可惜html元素仍在DOM中，仍然可以通过Page Source看到。

我已经检查了这个Completly remove a tag from the source和其他人，但是 IS 可以做到这一点-完全从源中删除元素吗？

Answer 1

在之后执行JavaScript，将初始页面提供给客户端。没办法解决。您必须将该逻辑从客户端JavaScript移至服务器端语言，例如PHP。这样，将在页面投放之前将其删除。

您找到的主题已经有the right answer：

这就是“查看源代码”在浏览器中的工作方式。它告诉你什么   来自服务器（通常从服务器[   可能会从缓存中读取它]），而不是页面中当前的内容。

要查看页面当前内容，您需要使用浏览器的开发工具（通常通过F12或Ctrl + Shift + I打开）中的“元素”或“ DOM”标签。通常，您可以通过右键单击页面上的该元素并选择“检查元素”来打开它并移动到特定元素，因此，如果在$（'。de'）。remove（）之后使用表单来执行此操作运行后，您将看到其中没有.de元素的表单。

使用JS或jQuery从DOM中完全删除元素/标签？

1 个答案: