javascript-从HTML删除所选元素的简单方法

前端之家收集整理的这篇文章主要介绍了javascript-从HTML删除所选元素的简单方法 前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

这是我自己的网站https://celestialbunny.github.io/frontend_02/,我正在尝试做一些“倾销”-通过普通的javascript从页面删除某些元素.

我努力了:

let body = document.body
let navs = document.querySelectorAll('nav');
let headers = document.querySelectorAll('header');
let footers = document.querySelectorAll('footer');
let imgs = document.querySelectorAll('img');
let as = document.querySelectorAll('a');
let links = document.querySelectorAll('link');
let scripts = document.querySelectorAll('script');

body.remove(navs);
body.remove(headers);
body.remove(footers);
body.remove(imgs);
body.remove(as);
body.remove(links);
body.remove(scripts);

就是这种情况,我们只能说我只做过:

>让body = document.body;
>让导航= document.querySelectorAll(‘nav’);
> body.remove(导航)
这将导致整个页面删除.

我曾尝试参考https://developer.mozilla.org/en-US/docs/Web/API/HTMLSelectElement/remove的文档,但似乎无法理解为什么从“ body”中删除“ child”会导致“空白页”

如何删除特定元素而不影响其余元素?

最佳答案
您的语法不正确.你不需要身体.

img的示例:

const imgs = document.querySelectorAll('img');
[...imgs].forEach(e => e.remove());

如果使用document.querySelectorAll()选择HTML元素,则会返回NodeList. NodeList与数组相似,但是不能直接循环.

删除NodeList中的目标元素,您必须遍历List.

使用[… imgs]或Array.from(imgs),可以将NodeList转换为Array.
现在,您可以遍历数组并删除其成员.

猜你在找的HTML相关文章