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()
相关推荐
宇木灵1 小时前
C语言基础学习-二、运算符
c语言·开发语言·学习
咕噜咕噜啦啦1 小时前
Vue3响应式开发
前端·javascript·vue.js
yangSimaticTech1 小时前
沿触发的4个问题
开发语言·制造
舟舟亢亢2 小时前
算法总结——二叉树【hot100】(上)
java·开发语言·算法
百锦再2 小时前
Java中的char、String、StringBuilder与StringBuffer 深度详解
java·开发语言·python·struts·kafka·tomcat·maven
huangql5203 小时前
布局单位与设计稿换算:从「看清」到「量准」
前端
普通网友3 小时前
多协议网络库设计
开发语言·c++·算法
努力努力再努力wz3 小时前
【Linux网络系列】:TCP 的秩序与策略:揭秘传输层如何从不可靠的网络中构建绝对可靠的通信信道
java·linux·开发语言·数据结构·c++·python·算法
牛奶3 小时前
你不知道的JS(下):深入编程
前端·javascript·电子书
牛奶3 小时前
你不知道的JS(下):深入JS(下)
前端·javascript·电子书