当前位置: 首页 > news >正文

【JavaScript算法】DOM树层级显示

题目描述:
在这里插入图片描述

上述表达式的输出结果为
['DIV']
['P', 'SPAN', 'P', 'SPAN']
['SPAN', 'SPAN']

直接上代码

let tree = document.querySelector(".a");
function traverseElRoot(elRoot) {const result = [];function traverse(element, level) {if (!result[level]) {result[level] = [];}result[level].push(element.tagName);Array.from(element.children).forEach((child) => {traverse(child, level + 1);});}traverse(elRoot, 0);return result;
}
console.log(traverseElRoot(tree));

输出
在这里插入图片描述

相关文章:

【JavaScript算法】DOM树层级显示

题目描述: 上述表达式的输出结果为 [DIV] [P, SPAN, P, SPAN] [SPAN, SPAN]直接上代码 let tree document.querySelector(".a"); function traverseElRoot(elRoot) {const result [];function traverse(element, level) {if (!result[level]) {resul…...

MySql实战--全局锁和表锁 :给表加个字段怎么有这么多阻碍

今天我要跟你聊聊MySQL的锁。数据库锁设计的初衷是处理并发问题。作为多用户共享的资源,当出现并发访问的时候,数据库需要合理地控制资源的访问规则。而锁就是用来实现这些访问规则的重要数据结构。 根据加锁的范围,MySQL里面的锁大致可以分成…...

axios请求类型是文件流怎么显示报错信息

axios请求类型是文件流,但是报错信息的话没法显示,在request.js文件中更改一下request拦截器代码: service.interceptors.request.use(config > { ...... , error > { console.log(error, 报错报错) // 处理请求错误 if (error.respons…...

DataX 源码改造支持Mysql 8.X

文章目录 DataX 源码改造支持Mysql 8.X问题背景克隆源代码并修改重新打包生产环境发布DataX 源码改造支持Mysql 8.X 问题背景 今天在使用DataX同步数据的时候遇到一个问题,报错如下 错误信息为:java.sql.SQLException: No suitable driver found for ["jdbc:mysql://…...

大数据学习-2024/3/29-oracle使用介绍

在plsql中登录ORACLE数据。 默认用户: 1、sys: 角色:数据库超级管理员账户。 权限:具有最高的权限,可以执行任何操作,包括操作数据字典和控制文件。可以创建和删除数据库对象,授予和回收其他用户…...

Vim - 文本编辑器 Vi vs Vim

你是否应该在学习 Vim 之前先学习 Vi,这完全取决于您自己、您的要求以及您的具体目标和需求。Vim 是 Vi 的扩展、增强和改进版本,它包括 Vi 的所有功能以及许多附加功能。 简约: Vi 设计简约。先学习 Vi 可以让你对基础知识有扎实的了解&…...

SpringBoot 登录认证(二)

SpringBoot 登录认证(一)-CSDN博客 SpringBoot 登录认证(二)-CSDN博客 SpringBoot登录校验(三)-CSDN博客 HTTP是无状态协议 HTTP协议是无状态协议。什么又是无状态的协议? 所谓无状态&…...

C#语言规范及特殊用法笔记

前言 记录在学习C#过程中遇到的知识点,会持续更新。 1. 常用数据类型结构的默认值 创建类的一个实例时,在执行构造函数之前,如果没给成员变量赋初始值,C#编译器将每一个成员变量初始化为默认值。虽然C#编译器为每个类型都设置了…...

Mysql数据库:日志管理、备份与恢复

目录 前言 一、MySQL日志管理 1、存放日志和数据文件的目录 2、日志的分类 2.1 错误日志 2.2 通用查询日志 2.3 二进制日志 2.4 慢查询日志 2.5 中继日志 3、日志综合配置 4、查询日志是否开启 二、数据备份概述 1、数据备份的重要性 2、备份类型 2.1 从物理与…...

kubernetes(K8S)学习(八):K8S之常见部署方案

K8S之常见部署方案 一、普通部署二、滚动更新(Rolling update)三、蓝绿部署(Blue/Green Deployment)四、灰度发布(金丝雀发布) 常见的部署方案参考博文:常见部署方案:普通部署、滚动…...

《AIGC重塑金融:AI大模型驱动的金融变革与实践》

🌈个人主页: Aileen_0v0 🔥热门专栏: 华为鸿蒙系统学习|计算机网络|数据结构与算法 ​💫个人格言:“没有罗马,那就自己创造罗马~” #mermaid-svg-oBSlqt4Vga1he7DL {font-family:"trebuchet ms",verdana,arial,sans-serif;font-siz…...

【详解】运算放大器工作原理及其在信号处理中的核心作用

什么是运算放大器 运算放大器(简称“运放”)是一种放大倍数非常高的电路单元。在实际电路中,它常常与反馈网络一起组成一定的功能模块。它是一种带有特殊耦合电路和反馈的放大器。输出信号可以是输入信号的加法、减法、微分和积分等数学运算…...

银河麒麟V10:sudo: /usr/bin/sudo 必须属于用户 ID 0(的用户)并且设置 setuid 位

一、引起原因: sudo chmod -R 777 bin 修改了/usr/bin/sudo的权限,引发后续问题。 二、现象: sudo执行命令报错: sudo: /usr/bin/sudo 必须属于用户 ID 0(的用户)并且设置 setuid 位 三、解决方法(知道root密码&…...

Android 多层级列表实现

方法一: Element.java : package com.chy.ydy.tools.treeutil; /*** TreeView 元素* */ public class Element {/** 文字内容 */private String contentText;/** 在tree中的层级 */private int level;/** 元素的id */private int id;/** 父元素的id */…...

柔数组的介绍

柔数组简单介绍 这个词你可能没有听过但是他的确是存在的。 1.在c99中结构中的最后⼀个元素允许是未知⼤⼩的数组,这就叫做『柔性数组』成员 2这就代表了它存在与结构体中,很重要的一点是,他只能是结构体的最后的一个成员,这是…...

跳槽多次未成功,问题源自何处?

众所周知,2023年市场很难!看着企业们纷纷裁员,甚至连内推这个后门都走不通!哪怕有面试,都是屡屡碰壁,你想清楚问题出在哪了吗?😭“求职不得,夜不能寐;三更半夜…...

Linux 操作系统 022-串口/U盘/共享文件夹

Linux 操作系统 022-串口/U盘/共享文件夹 本节关键字:Linux、centos、串口、U盘、共享文件夹 本节相关指令:echo、cat、mkdir、mount 1、串口 #(1) 查看串口是否可用,可以对串口发送数据比如: $ echo helloworld >/dev/ttyS…...

java题目9:100匹马驮100担货,大马一匹驮3担,中马一匹驮2担,小马两匹驮1担。计算大中小马的数目(HorsesPackGoods9)

每日小语 正是他的意图损坏了他的悟性。——《充足理由律的四重根》 思考 有点鸡兔同笼的感觉嗷, //100匹马驮100担货,大马一匹驮3担,中马一匹驮2担,小马两匹驮1担。计算大中小马的数目(public class HorsesPackGoo…...

操作系统OS Chapter1

操作系统OS 一、概念和功能1.概念2.功能3.目标 二、特征1.并发2.共享3.虚拟4.异步 三、发展四、运行机制五、中断和异常1.中断的作用2.中断的类型3.中断机制的原理 六、系统调用七、操作系统结构八、操作系统引导九、虚拟机 一、概念和功能 1.概念 操作系统(OS&…...

UE4_Mouse_Interaction——拖拽物体的实现

鼠标拖拽物体,效果如下图: 1、新建PlayerController,更名字为MI_PlayerController,双击打开并设置参数: 2、新建GameMode,更名为MI_Gameinfo。参数如下设置: 3、新建材质,更名为BasicAsset02.参…...

【网络】每天掌握一个Linux命令 - iftop

在Linux系统中,iftop是网络管理的得力助手,能实时监控网络流量、连接情况等,帮助排查网络异常。接下来从多方面详细介绍它。 目录 【网络】每天掌握一个Linux命令 - iftop工具概述安装方式核心功能基础用法进阶操作实战案例面试题场景生产场景…...

FastAPI 教程:从入门到实践

FastAPI 是一个现代、快速(高性能)的 Web 框架,用于构建 API,支持 Python 3.6。它基于标准 Python 类型提示,易于学习且功能强大。以下是一个完整的 FastAPI 入门教程,涵盖从环境搭建到创建并运行一个简单的…...

Linux相关概念和易错知识点(42)(TCP的连接管理、可靠性、面临复杂网络的处理)

目录 1.TCP的连接管理机制(1)三次握手①握手过程②对握手过程的理解 (2)四次挥手(3)握手和挥手的触发(4)状态切换①挥手过程中状态的切换②握手过程中状态的切换 2.TCP的可靠性&…...

pam_env.so模块配置解析

在PAM(Pluggable Authentication Modules)配置中, /etc/pam.d/su 文件相关配置含义如下: 配置解析 auth required pam_env.so1. 字段分解 字段值说明模块类型auth认证类模块,负责验证用户身份&am…...

蓝牙 BLE 扫描面试题大全(2):进阶面试题与实战演练

前文覆盖了 BLE 扫描的基础概念与经典问题蓝牙 BLE 扫描面试题大全(1):从基础到实战的深度解析-CSDN博客,但实际面试中,企业更关注候选人对复杂场景的应对能力(如多设备并发扫描、低功耗与高发现率的平衡)和前沿技术的…...

django filter 统计数量 按属性去重

在Django中,如果你想要根据某个属性对查询集进行去重并统计数量,你可以使用values()方法配合annotate()方法来实现。这里有两种常见的方法来完成这个需求: 方法1:使用annotate()和Count 假设你有一个模型Item,并且你想…...

python如何将word的doc另存为docx

将 DOCX 文件另存为 DOCX 格式(Python 实现) 在 Python 中,你可以使用 python-docx 库来操作 Word 文档。不过需要注意的是,.doc 是旧的 Word 格式,而 .docx 是新的基于 XML 的格式。python-docx 只能处理 .docx 格式…...

NLP学习路线图(二十三):长短期记忆网络(LSTM)

在自然语言处理(NLP)领域,我们时刻面临着处理序列数据的核心挑战。无论是理解句子的结构、分析文本的情感,还是实现语言的翻译,都需要模型能够捕捉词语之间依时序产生的复杂依赖关系。传统的神经网络结构在处理这种序列依赖时显得力不从心,而循环神经网络(RNN) 曾被视为…...

Python基于历史模拟方法实现投资组合风险管理的VaR与ES模型项目实战

说明:这是一个机器学习实战项目(附带数据代码文档),如需数据代码文档可以直接到文章最后关注获取。 1.项目背景 在金融市场日益复杂和波动加剧的背景下,风险管理成为金融机构和个人投资者关注的核心议题之一。VaR&…...

Razor编程中@Html的方法使用大全

文章目录 1. 基础HTML辅助方法1.1 Html.ActionLink()1.2 Html.RouteLink()1.3 Html.Display() / Html.DisplayFor()1.4 Html.Editor() / Html.EditorFor()1.5 Html.Label() / Html.LabelFor()1.6 Html.TextBox() / Html.TextBoxFor() 2. 表单相关辅助方法2.1 Html.BeginForm() …...