从 DOM 中删除 HTML答案

【问题标题】：Removing HTML from DOM从 DOM 中删除 HTML
【发布时间】：2021-02-04 13:36:00
【问题描述】：

我必须使用 Google 跟踪代码管理器进行更改以临时修复某些问题，直到我可以访问网站的后端。我正在尝试删除基于类的 div 容器。我已经能够使用以下代码成功创建自定义 HTML 标记，以添加删除 div 容器，如下所示：

<script> 
function changeHtml () 
{ 
document.getElementsByClassName("signup")[0].style.display = "none"; 
} 
change = changeHtml(); 
</script>

问题是这个 div 容器中有问题的项目是一个表单。我很快发现如果你应用 display: none;通过 css 表单仍然有效。删除它的真正方法是将其从 DOM 中删除。我尝试添加以下 JS 但没有任何成功：

<script>
const elem = document.getElementsByClassName('signup');
elem.parentNode.removeChild(elem);
</script>

接收错误：

Javascript 编译器错误：第 3 行错误，字符 1：此语言功能仅支持更好的 ECMASCRIPT6 模式：const 声明

【问题讨论】：

【解决方案1】：

使用remove()方法从DOM中移除选中的元素：

<script>
  document.getElementsByClassName('signup')[0].remove();
</script>

【讨论】：

【解决方案2】：

你可以通过尝试这个来轻松实现这一点

<script>
  const elem = document.getElementsByClassName('signup')[0];
  elem.outerHTML = '';
</script>

【讨论】：

感谢您，我尝试了此选项并收到 Javascript 编译器错误：第 3 行错误，字符 1：此语言功能仅支持更好的 ECMASCRIPT6 模式：const 声明
看我的回答。目前不支持 ES6 和 const 关键字。

【解决方案3】：

目前，GTM 仅在自定义模板中支持 ES6，因此在自定义 javascript 标签中使用 const 会导致错误。您的描述有些笼统（“不起作用”），因此只是假设这是您的问题。此外，您的标签必须仅在您要删除的元素实际存在后执行（在 DOM 准备好或使用可见性触发器时）。

【讨论】：