jQuser有选择器

jQuery基本选择器

名称 用法 描述
ID选择器 $('#id'); 获取指定ID的元素
类选择器 $('.class'); 获取同一类class的元素
标签选择器 $('div'); 获取同一类标签的所有元素
并集选择器 $('div,p,li'); 使用逗号分隔,只要符合条件之一就可。
交集选择器 $('div.redClass'); 获取class为redClass的div元素

jQuery过滤选择器

名称 用法 描述
:eq(index) $('li:eq(2)').css('color', 'red'); 获取到的li元素中,选择索引号为2的元素,索引号index从0开始。
:odd $('li:odd').css('color', 'red'); 获取到的li元素中,选择索引号为奇数的元素
:even $('li:even').css('color', 'red'); 获取到的li元素中,选择索引号为偶数的元素

jQuery层级选择器

名称 用法 描述
子代选择器 $('ul > li'); 使用-号,获取儿子层级的元素,注意,并不会获取孙子层级的元素
后代选择器 $('ul li'); 使用空格,代表后代选择器,获取ul下的所有li元素,包括孙子等

jQuery筛选选择器(方法)

名称 用法 描述
children(selector) $('ul').children('li') 相当于$('ul-li'),子类选择器
find(selector) $('ul').find('li'); 相当于$('ul li'),后代选择器
siblings(selector) $('#first').siblings('li'); 查找兄弟节点,不包括自己本身。
parent() $('#first').parent(); 查找父亲
eq(index) $('li').eq(2); 相当于$('li:eq(2)'),index从0开始
next() $('li').next() 找下一个兄弟
prev() $('li').prev() 找上一次兄弟
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 环境搭建 进入官方网站获取最新的版本 http://jquery.com/download/ ,这里需要注意 j...
    阿r阿r阅读 895评论 0 7
  • 一、样式篇 第1章 初识jQuery (1)环境搭建 进入官方网站获取最新的版本 http://jquery.co...
    凛0_0阅读 3,712评论 0 44
  • 第一章 jQuery简介 1-1 jQuery简介 1.简介 2.优势 3.特性与工具方法 1-2 环境搭建 进入...
    mo默22阅读 1,793评论 0 11
  • 透过阔大的玻璃窗,阳光毫无遮拦的倾泻进来,和室内的暖气交融在一起,窗外是一望无垠的蓝天,用我和先生的话说是“...
    木子君mm阅读 364评论 1 0
  • 本文是在上一篇blog的圣杯布局和双飞翼布局基础上的一些改进。 不考虑把layout__main这个元素放在最前面...
    sunny519111阅读 4,243评论 0 7

友情链接更多精彩内容