JavaScript:DOM (5) 节点的CRUD - 修改、删除

news2024/10/1 17:37:22

修改(替换)节点
替换子项
replaceChild()可以将指定元素的某个子节点换成新的节点,语法为指定元素.replaceChild(新节点, 旧节点)。

 范例:

原始结构:

<ul>
    <li>第一项</li>
    <li>第二项</li>
    <li>第三项</li>
<ul>
// 建立新的节点
let newli = document.createElement('li');
newli.innerHTML = "我是新的 li";
// 取得父节点
let parent = document.querySelector('ul');
// 取得要被 replace 的节点
let oldli = document.querySelectorAll('ul li')[1];
// 执行 replace
parent.replaceChild(newli, oldli);

删除节点
删除子项
使用removeChild可以删除父节点中某个子节点,用法为父节点.removeChild(子节点)。
**范例:**删除第二项
// 抓父节点
let parent = document.querySelector('ul');
// 要被删除的节点
let second = document.querySelectorAll('ul li')[1];
// 删除
parent.removeChild(second);


删除属性
removeAttribute会删除元素节点的指定属性。

范例:删除属性

<div id="container" name="myDiv" style="background-color: red;">123</div>

// 抓目标元素
let target = document.getElementById('container');
// 删除元素的 style 属性
target.removeAttribute('style');

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/905294.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Python编程从入门到实践_8-8 用户的专辑_答案

Python编程从入门到实践_8-8 用户的专辑_答案 我也看了一些其他人的答案&#xff0c;很多的答案存在问题&#xff0c;每次调用函数 make_album() 后生成一个专辑字典会覆盖上次调用函数 make_album() 生成的字典&#xff0c;不符合题意。 我采取的解决方案是添加一个空列表 …

全局异常捕获

一、创建普获异常的类 二、定义异常处理器 定义全局异常处理器非常简单&#xff0c;就是定义一个类&#xff0c;在类上加上一个注解RestControllerAdvice&#xff0c;加上这个注解就代表我们定义了一个全局异常处理器。 在全局异常处理器当中&#xff0c;需要定义一个方法来捕…

第二章、应用层

文章目录 2.1 应用层原理2.1.1 网络应用程序体系结构2.1.2 进程通信2.1.3 可供应用程序使用的运输服务2.1.4 因特网提供的运输服务2.1.5 应用层协议 2.2.2 Web 和 HTTP2.2.1 HTTP概况2.2.2 非持续连接和持续连接2.2.3 HTTP报文格式2.2.4 用户与服务器的交互&#xff1a;cookie2…

华为ENSP网络设备配置实战6(简单的链路聚合)

题目要求 1、创建聚合组&#xff0c;添加端口成员 2、PC1网段为vlan10&#xff0c;PC2网段为vlan20 3、LSW1为核心网关设备&#xff0c;正确配置PC网关 4、PC1与PC2互通 解题过程 1.1、 按照拓扑图&#xff0c;各个设备起名 sys &#xff08;进入系统视图&#xff09; sy…

OpenCV4环境配置

0.安装mingw64 官网链接&#xff1a;mingw 安装红框标记下载免安装版本&#xff0c;解压可用。 将解压后的mingw64\bin添加到path环境变量cmd中输入gcc -v&#xff0c;出现下图所示即配置成功 1.下载OpenCV源码 源码下载 官网&#xff1a;Releases - OpenCV 运行下载好的ex…

负载均衡下的 WebShell 连接

目录 负载均衡简介负载均衡的分类网络通信分类 负载均衡下的 WebShell 连接场景描述难点介绍解决方法**Plan A** **关掉其中一台机器**&#xff08;作死&#xff09;**Plan B** **执行前先判断要不要执行****Plan C** 在Web 层做一次 HTTP 流量转发 &#xff08;重点&#xff0…

经典组合优化问题

本文根据学习进度不定时更新。 团问题 此处要理解"each pair of which is connected by an edge"的含义&#xff0c;这里的which指的是谁呢&#xff1f;肯定是vertices&#xff0c;即每一对定点都有一条边连接起来。 团问题是NPC问题。 团问题和定点覆盖问题、边覆盖…

LLM提示词工程和提示词工程师Prompting and prompt engineering

你输入模型的文本被称为提示&#xff0c;生成文本的行为被称为推断&#xff0c;输出文本被称为完成。用于提示的文本或可用的内存的全部量被称为上下文窗口。尽管这里的示例显示模型表现良好&#xff0c;但你经常会遇到模型在第一次尝试时无法产生你想要的结果的情况。你可能需…

22.0.6 LEADTOOLS 增加了 Python 支持 -Crack

LEADTOOLS 增加了 Python 支持 Python 开发人员现在可以利用 LEADTOOLS 技术&#xff0c;包括识别、多媒体和成像。 2023 年 7 月 18 日 - 16:40新版本 特征 添加了完整的 Python 支持 LEADTOOLS Python 支持包括高级图像处理功能、OCR、PDF、条形码识别和表单处理&#xff0c;…

FPGA原理与结构——RAM IP核原理学习

目录 一、什么是RAM 二、RAM IP介绍 1、RAM分类简介 2、可选的内存算法 &#xff08;1&#xff09;Minimum Area Algorithm&#xff08;最小面积算法&#xff09; &#xff08;2&#xff09;Low Power Algorithm &#xff08;低功耗算法&#xff09; &#xff08;3&#x…

ChatGPT-4: 半年的深度使用思考

几个月的时间一直在使用 ChatGpt-4&#xff0c;以口述语音转文字的形式说一下自己的体会。 1、选择版本 大前提&#xff1a;我使用的都是 GPT4 的版本。也就是说至少每个月要付费20$。 因为 3.5 的版本&#xff0c;实际上使用体验是非常差的&#xff0c;主要体现在答非所问上。…

【C++习题集】-- 堆

&#xff08;用于复习&#xff09; 目录 树概念及结构 名词概念 二叉树概念及结构 特殊的二叉树 满二叉树 完全二叉树 运算性质 二叉树存储结构 顺序存储 链式存储 堆 - 顺序存储 堆的性质 堆的实现 堆的应用 堆排序 直接建堆法 树概念及结构 概念&#xff1a…

shell脚本——文件三剑客之sed

目录 一.sed基本用法及选项 ​二.sed脚本语法及命令 三.sed的查找替换使用 四.后向引用 五.变量 一.sed基本用法及选项 sed [选项]... {自身脚本语法};.... [input file...] seq 10 |sed #生成1-10数字传给sed #该格式报错&#xff0c;基本格式中的{自身脚本语法}不…

Stable Diffusion的使用以及各种资源

Stable Diffsuion资源目录 SD简述sd安装模型下载关键词&#xff0c;描述语句插件管理controlNet自己训练模型 SD简述 Stable Diffusion是2022年发布的深度学习文本到图像生成模型。它主要用于根据文本的描述产生详细图像&#xff0c;尽管它也可以应用于其他任务&#xff0c;如…

【SA8295P 源码分析】06 - SA8295P XBL Loader 阶段 sbl1_main_ctl 函数代码分析

【SA8295P 源码分析】06 - SA8295P XBL Loader 阶段 sbl1_main_ctl 函数代码分析 一、XBL Loader 汇编源码分析1.1 解析 boot\QcomPkg\XBLLoader\XBLLoader.inf1.2 boot\QcomPkg\XBLDevPrg\ModuleEntryPoint.S&#xff1a;跳转 sbl1_entry 函数1.3 XBLLoaderLib\sbl1_Aarch64.s…

shell脚本之循环语句

循环语句 循环含义 将某代码段重复运行多次&#xff0c;通常有进入循环的条件和退出循环的条件 for循环语句 一般知道循环次数使用for循环 第一类 格式1&#xff1a; for名称 in 取值次数;do;done; 格式2&#xff1a; for 名称 in {取值列表} do done# 打印20次 for i i…

docker安装redis7-分片集群

说明 系统&#xff1a;CentOS7.9 redis&#xff1a;7.0.5 因资源有限所有节点部署在一台宿主机上&#xff0c;总共启动6个redis实例&#xff0c;实例对应端口分别从6380-6385&#xff0c;文章中给的有执行脚本&#xff0c;方便配置redis和操作redis实例 下载镜像 docker …

JVM的元空间了解吗?

笔者近期在面试的时候被问到了这个问题&#xff0c;元空间也是Java8当时的一大重大革新&#xff0c;之前暑期实习求职的时候有专门看过&#xff0c;但是近期秋招的时候JVM相关的内容确实有点生疏了&#xff0c;故在此进行回顾。 结构 首先&#xff0c;我们应了解JVM的堆结构&a…

c++——引用(语法、引用特性、常引用、函数返回值引用和指针与引用的不同点)

c中的引用 一、引用 1、引用的概念&#xff1a;给变量取别名。 形式&#xff1a;原类型名& 别名 引用实体旧名&#xff1b; 2、特性&#xff1a; ①引用定义时必须初始化 ②引用一旦初始化之后就不能再改变引用的指向 ③不能引用NULL ④&再等号的左边为引用&…

FPGA原理与结构——ROM IP的使用与测试

一、前言 本文介绍Block Memory Generator v8.4 IP核 实现ROM&#xff0c;在学习一个IP核的使用之前&#xff0c;首先需要对于IP核的具体参数和原理有一个基本的了解&#xff0c;具体可以参考&#xff1a; FPGA原理与结构——块RAM&#xff08;Block RAM,BRAM&#xff09;http…