JavaScript------querySelector/querySelectorAll的使用
1、基础语法
querySelector() 方法返回文档中匹配指定 CSS 选择器的一个元素。
querySelector() 方法仅仅返回匹配指定选择器的第一个元素。如果你需要返回所有的元素，请使用 querySelectorAll() 方法替代。
属性：指定一个或多个匹配元素的 CSS 选择器。 可以使用它们的 id, 类, 类型, 属性, 属性值等来选取元素。
1 2 | document.querySelector()document.querySelectorAll() |
2、项目实践
1、设置查询的底1个元素
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | <!DOCTYPE html><html><head><meta charset="utf-8"><title>菜鸟教程(runoob.com)</title></head><body><p>这是一个 p 与元素。</p><p>这也是一个 p 与元素。</p><p>点击按钮修改文档中第一个 p 元素的背景颜色。</p><button onclick="myFunction()">点我</button><script>function myFunction() { document.querySelector("p").style.backgroundColor = "red";}</script></body></html> |
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· TypeScript + Deepseek 打造卜卦网站：技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 三行代码完成国际化适配，妙~啊~
· .NET Core 中如何实现缓存的预热？