博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
HTML5--JS API-新的选择器
阅读量:5055 次
发布时间:2019-06-12

本文共 889 字,大约阅读时间需要 2 分钟。

新的选择器

document.querySelector("selector");
selector:根据CSS选择器返回第一个匹配到的元素,如果没有匹配到,则返回null;
支持: Chrome 4.0+, FireFox 3.5+, Safari 3.2+, Opera 10.1+, IE 8+
document.querySelectorAll("selector");
selector:根据CSS选择器返回所有匹配到的元素数组,如果没有匹配到,则返回空数组;
支持: Chrome 4.0+, FireFox 3.5+, Safari 3.2+, Opera 10.1+, IE 8+
document.getElementsByClassName("selector");
selector:根据类选择器返回所有匹配到的元素数组,如果没有匹配到,则返回空数组;
支持: Chrome 4.0+, FireFox 3.0+, Safari 3.2+, Opera 10.1+, IE 8+

案例如下:

HTML结构如下:

1 
   2
         3
  • 实例
  • 4      5
  • 实例
  • 6      7
  • 实例
  • 8      9
  • 实例
  • 10     11
  • 实例
  • 12 13   
14 15

 

 1、如果想要获得第一个li元素,我们只需要:

document.querySelector(".content ul li");
2、如果想要获得所有li元素,我们只需要:
document.querySelectorAll(".content ul li");
3、如果想要获得所有class为w3c的li元素,我们只需要:
document.getElementsByClassName("w3c");

转载于:https://www.cnblogs.com/asqq/archive/2012/06/20/2556944.html

你可能感兴趣的文章
基于pyQt5开发的股价显示器(原创)
查看>>
robotium学习及整理
查看>>
android TimerTask 的简单应用
查看>>
团 队 作 业 ———— 随 堂 小 测
查看>>
注入器(injector)
查看>>
校园宿舍管理系统部分功能代码实现
查看>>
获取和设置cookie的方法(5种)
查看>>
一步步学习微软InfoPath2010和SP2010--第七章节--从SP列表和业务数据连接接收数据(4)--外部项目选取器和业务数据连接...
查看>>
如何增强你的SharePoint 团队网站首页
查看>>
FZU 1914 Funny Positive Sequence(线性算法)
查看>>
oracle 报错ORA-12514: TNS:listener does not currently know of service requested in connec
查看>>
基于grunt构建的前端集成开发环境
查看>>
MySQL服务读取参数文件my.cnf的规律研究探索
查看>>
java string(转)
查看>>
__all__有趣的属性
查看>>
BZOJ 5180 [Baltic2016]Cities(斯坦纳树)
查看>>
写博客
查看>>
利用循环播放dataurl的视频来防止锁屏:NoSleep.js
查看>>
品味第一杯瓜哇咖啡
查看>>
第十四周总结Access
查看>>