jQuery 选择器

jQuery 常用选择器

//基本选择器
$("#myELement")    //选择id值等于myElement的元素
$("div")    //选择所有的div标签元素,返回div元素数组 
$(".myClass")    //选择使用myClass类的css的所有元素 
$("*")    //选择文档中的所有的元素
$("#myElement,div,.myClass")    //联合选择,选择id为myElement,div标签并含有myClass样式的所有标签

//层级选择器
$("div p")    //选择div标签内所有的p标签元素,包括子元素的子元素
$("div > p")    //选择div标签内所有的p标签元素 ,不包括子元素的子元素
$("div + p")    //选择紧跟div标签的p标签元素,div与p为兄弟节点
$("div ~ p")    // 同胞选择器,选择所有与div标签同级的p标签元素,即div与p为兄弟节点
$("A B")    //查找A元素下面的所有子节点,包括非直接子节点
$("A>B")    //查找A元素下面的直接子节点
$("A+B")    //查找A元素后面的兄弟节点,包括非直接子节点
$("A~B")    //查找A元素后面的兄弟节点,不包括非直接子节点

//基本过滤选择器
$("tr:first")    //选择所有tr元素的第一个 
$("tr:last")    //选择所有tr元素的最后一个 
$("input:not(:checked)")   //选择所有未选中的input
$("tr:even")    //选择所有的tr元素的第0,2,4... ...个元素 
$("tr:odd")    //选择所有的tr元素的第1,3,5... ...个元素 
$("td:eq(2)")    //选择所有的td元素中序号为2的那个td元素 
$("td:gt(4)")    //选择td元素中序号大于4的所有td元素 
$("td:lt(4)")    //选择td元素中序号小于4的所有的td元素 

//内容过滤选择器
$("div:contains('John')")    //选择所有div中含有John文本的元素 
$("td:empty")    //选择所有的为空(也不包括文本节点)的td元素 
$("div:has(p)")    //选择所有含有p标签的div元素 
$("td:parent")    //选择td的父元素

//可视化过滤选择器
$("div:hidden")        //选择被hidden的div元素 
$("div:visible")        //选择所有的可视化的div元素 

//属性过滤选择器
$("div[id]")        //选择所有含有id属性的div元素 
$("input[name='newsletter']")    //选择所有的name属性等于'newsletter'的input元素 
$("input[name!='newsletter']")    //选择所有的name属性不等于'newsletter'的input元素 
$("input[name^='news']")    //选择所有的name属性以'news'开头的input元素 
$("input[name$='news']")    //选择所有的name属性以'news'结尾的input元素 
$("input[name*='man']")    //选择所有的name属性包含'news'的input元素 
$("input[id][name$='man']")    //可以使用多个属性进行联合选择,选择所有的含有id并且name属性以man结尾的元素 

//表单元素选择器
$(":input")        //选择所有的表单输入元素,包括input, textarea, select 和 button 
$(":text")        //选择所有的text input元素 
$(":password")    //选择所有的password input元素 
$(":radio")    //选择所有的radio input元素 
$(":checkbox")    //选择所有的checkbox input元素 
$(":submit")    //选择所有的submit input元素 
$(":image")    //选择所有的image input元素 
$(":reset")    //选择所有的reset input元素 
$(":button")    //选择所有的button input元素 
$(":file")    //选择所有的file input元素 
$(":hidden")    //选择所有类型为hidden的input元素或表单的隐藏域 
 
//表单元素过滤选择器
$(":enabled")    //选择所有的可操作的表单元素 
$(":disabled")    //选择所有的不可操作的表单元素 
$(":checked")    //选择所有的被checked的表单元素 
$("select option:selected")    //选择所有的select 的子元素中被selected的元素 

原创文章,转载请注明: 转载自 芬芬杨杨
本文链接地址: https://www.codeqin.com/2018/09/17/366.html

此条目发表在jQuery分类目录。将固定链接加入收藏夹。

发表评论

电子邮件地址不会被公开。 必填项已用*标注