HTML DOM 教程---获取常规元素方式(2)

querySelector 只能返回遇到的第一个对象

querySelectorAll 返回所有的

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>获取常规元素</title>
</head>
<body>
    <ul>
        <li class="newsitem">111111111</li>
        <li class="newsitem">111111111</li>
        <li class="newsitem">111111111</li>
    </ul>
    <ul>
        <li class="adsitem">111111111</li>
        <li class="adsitem">111111111</li>
        <li class="adsitem">111111111</li>
    </ul>

    <script>
        
        // querySelector 只能返回遇到的第一个对象
        var item = document.querySelector("ul li")
        console.log(item)

        // querySelectorAll  返回所有的
        var item1 = document.querySelectorAll("ul li.newsitem")
        console.log(item1)
    </script>
</body>
</html>

相关推荐
zfj3216 分钟前
CyclicBarrier、CountDownLatch、Semaphore 各自的作用和用法区别
java·开发语言·countdownlatch·semaphore·cyclicbarrier
张np13 分钟前
java基础-ConcurrentHashMap
java·开发语言
早日退休!!!14 分钟前
进程与线程的上下文加载_保存及内存映射
开发语言
jllllyuz15 分钟前
MATLAB实现蜻蜓优化算法
开发语言·算法·matlab
持续升级打怪中18 分钟前
Vue3 中虚拟滚动与分页加载的实现原理与实践
前端·性能优化
GIS之路21 分钟前
GDAL 实现矢量合并
前端
hxjhnct24 分钟前
React useContext的缺陷
前端·react.js·前端框架
冰暮流星31 分钟前
javascript逻辑运算符
开发语言·javascript·ecmascript
flysh0532 分钟前
如何利用 C# 内置的 Action 和 Func 委托
开发语言·c#
前端 贾公子1 小时前
从入门到实践:前端 Monorepo 工程化实战(4)
前端