当前位置: 首页 > 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.参…...

如何用开源工具实现MobaXterm专业版功能解锁?技术方案与实践指南

如何用开源工具实现MobaXterm专业版功能解锁?技术方案与实践指南 【免费下载链接】MobaXterm-keygen 项目地址: https://gitcode.com/gh_mirrors/moba/MobaXterm-keygen 在远程服务器管理领域,MobaXterm专业版凭借其集成SSH、X11转发、多标签会话…...

18-AI论文创作:自动找参考文献并精准标注

示例 薛磊.组织学习、数字能力与组织敏捷性的关系研究[D].吉林大学,2024. https://link.cnki.net/doi/10.27162/d.cnki.gjlin.2024.001308 关键词: 数字技术 组织学习 AI实战 使用大模型“探索” 请找到这这段话的内容向匹配的参考文献,并以&#xff…...

开源工具Rufus实现专业级启动盘制作的完整指南

开源工具Rufus实现专业级启动盘制作的完整指南 【免费下载链接】rufus The Reliable USB Formatting Utility 项目地址: https://gitcode.com/GitHub_Trending/ru/rufus 系统重装时遇到的启动失败、镜像损坏、硬件不兼容等问题是否让你束手无策?作为一款免费…...

ExplorerPatcher:如何用开源方案高效解决Windows 11界面定制难题?

ExplorerPatcher:如何用开源方案高效解决Windows 11界面定制难题? 【免费下载链接】ExplorerPatcher 提升Windows操作系统下的工作环境 项目地址: https://gitcode.com/GitHub_Trending/ex/ExplorerPatcher Windows 11 24H2带来了全新的界面设计&…...

C++开发者必看:nlohmann::json实战避坑指南(含性能优化技巧)

C开发者必看:nlohmann::json实战避坑指南(含性能优化技巧) 如果你正在用C处理JSON数据,nlohmann::json库大概率已经出现在你的项目依赖中。这个被戏称为"现代C的瑞士军刀"的库,确实让JSON操作变得像std::vec…...

图像分类模型实战指南:从技术选型到部署优化的全流程解析

图像分类模型实战指南:从技术选型到部署优化的全流程解析 【免费下载链接】pytorch-image-models huggingface/pytorch-image-models: 是一个由 Hugging Face 开发维护的 PyTorch 视觉模型库,包含多个高性能的预训练模型,适用于图像识别、分类…...

如何快速上手Awesome Burp Extensions:新手必看的10个核心插件

如何快速上手Awesome Burp Extensions:新手必看的10个核心插件 【免费下载链接】awesome-burp-extensions A curated list of amazingly awesome Burp Extensions 项目地址: https://gitcode.com/gh_mirrors/aw/awesome-burp-extensions Burp Suite作为Web应…...

深入解析Docker Bridge网络模式:从docker0到容器互联实战

1. Docker Bridge网络模式初探 刚接触Docker时,我发现每次启动容器都会自动分配一个IP地址,这些容器之间居然能直接互相访问。这背后的魔法就是Bridge网络模式——Docker的默认网络方案。想象一下docker0就像公司内部的交换机,所有工位&#…...

如何高效完成从SVN到Git的完整迁移:svn2git实战指南

如何高效完成从SVN到Git的完整迁移:svn2git实战指南 【免费下载链接】svn2git 项目地址: https://gitcode.com/gh_mirrors/sv/svn2git 在软件开发生命周期中,版本控制系统迁移是一个关键但充满挑战的任务。随着Git在分布式版本控制领域的统治地位…...

工厂工艺管理进阶:SMT生产阶别如何实现精细化管控?

在电子制造领域,生产工艺的复杂性与精细化程度直接决定了产品的良率与交付能力。其中,表面贴装技术作为电子组装的核心环节,其管理粒度往往成为衡量工厂工艺管理水平的重要标尺。然而,在实际运营中,许多企业仍将SMT与其…...