querySelectorAll与getElementsByTagName等区别

1,querySelector 获取的是nodeList,可直妆forEach循环

2,getElement获取到的是HTMLCollection,需要使用Array.from转换为数组后才可遍历,当然,可以直接用for,不需要转换

3,querySelector获取到的不是动态,而getElement获取到的是动态的。如下:

javascript 复制代码
const insert = () => {
    const div = document.createElement("div")
    div.innerHTML = "vvvvvv"
    document.getElementById("app").appendChild(div)
}
const test = () =>{
    const aa = document.querySelectorAll("div")
    const bb = document.getElementsByTagName("div")
    insert()
    console.log(aa.length) // 此处不会把insert插件的DIV计算入内
    console.log(Array.from(bb).length)// 此处会把insert插件的DIV计算入内
}

test()
相关推荐
凯瑟琳.奥古斯特18 分钟前
K次取反最大化数组和解法(力扣1005)
开发语言·c++·算法·leetcode·职场和发展
负责的蛋挞24 分钟前
异步HttpModule的实现方式
java·服务器·前端
AC赳赳老秦31 分钟前
防火墙规则批量配置实战:OpenClaw 自动生成模板、批量下发与合规性校验全解析
java·开发语言·人工智能·python·github·php·openclaw
☆cwlulu1 小时前
调试排查工具介绍(gdb、strace、Valgrind等)
开发语言·c++·嵌入式硬件·ubuntu
C语言小火车1 小时前
C++ 快速排序(Quick Sort)深度精讲:分治思想、Lomuto 分区法及三数取中优化,面试手撕必会
c语言·开发语言·c++·面试·排序算法·快速排序
sycmancia1 小时前
Qt——多线程间的互斥
开发语言·qt
一知半解仙2 小时前
2026年彻底免费的辅助编程Agent大模型汇总
开发语言·人工智能·开源
Mr-Wanter2 小时前
wsl2 jdk管理工具之sdkman
java·开发语言·sdkman
2502_921286072 小时前
【企业网络管理】DHCP 与 SAMBA:从协议原理到企业级实战配置全解析
开发语言·php