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>

相关推荐
Bat U1 分钟前
JavaEE|文件操作和IO
java·开发语言
qq_381338503 分钟前
CSS @layer 级联层实战指南:从样式冲突到分层架构
前端·css
广州华水科技6 分钟前
深度测评2026年好用的单北斗GNSS变形监测系统推荐,提升GNSS位移监测精度,引领智能监控新风尚
前端
脉动数据行情6 分钟前
Python 实现融通金行情数据对接(实时推送 + K 线 + 产品列表)
开发语言·python
剑神一笑11 分钟前
Linux awk 命令:文本处理的瑞士军刀
linux·运维·chrome
花归去23 分钟前
vue3中 function getText(){} 、 const getText=()=>{} ;区别在哪里,优缺点
javascript·vue.js·ecmascript
ZC跨境爬虫36 分钟前
跟着 MDN 学 HTML day_33:(Attr 接口与属性节点的深入理解)
前端·javascript·ui·html·音视频·html5
skywalk816344 分钟前
Trae生成的中文编程语言关键字(如“定“、“函“、“印“等)需要和标识符之间用 空格 隔开,以确保正确识别
服务器·开发语言·编程
神所夸赞的夏天1 小时前
如何获取多层json数据,存成dictionary,并取最大最小值
java·前端·json
红色的小鳄鱼1 小时前
前端面试js手写
开发语言·前端·javascript