jQuery学习之过滤选择器

:first 选取第一个元素:$("div:first")

:last 选取最后一个元素:$("div:last")

:not(selector) 取出除selector之外的其他元素:$("div:not(.class)")

:even 选取索引为偶数的元素:$("div:even")

:odd 选取索引为奇数的元素:$("div:odd")

:eq(index) 索引等于index:$("div:eq(1)")

:gt(index) 索引大于index:$("div:gt(1)")

:lt(index) 索引小于index:$("div:lt(1)")

:header 选择所有标签元素(h1,h2,h3):$("div:header")

:animated 选取当前正在执行动画的所有元素:$("div:animated")

内容过滤选择器

:contain(text) 选取文本含有text的元素:$("div:contain(‘Hello world‘)")

:empty 选取不包含子元素或者文本的空元素:$("div:empty")

:has(selector) 选取含有选择器所匹配的元素的元素:$("div:has(p)")

:parent 选取含有子元素或者文本的元素:$("div:parent")

可见性过滤选择器

:hidden 选取不可见的元素

:visible 选取可见的元素

属性过滤选择器

[attribute] 选取拥有此属性的元素:$("div[align]")

[attribute=value] 选取属性值为value的元素:$("div[align=center]")

[attribute!=value] 选取属性值不为value的元素:$("div[align!=center]")

[attribute^=value] 选取属性值以value开始的元素:$("div[align^=center]")

[attribute$=value] 选取属性值以value结束的元素:$("div[align$=center]")

[attribute*=value] 选取属性值含有value的元素:$("div[align*=c]")

[attribute][attribute][attribute] 用属性选择器合并成的选择器:$("div[align*=c][id][class]")

子元素过滤选择器

:nth-child(index/even/odd/equation) 选取每个父元素下第index个元素(从1开始)

:first-child 选取每个父元素的第一个子元素

:last-child 选取每个父元素的最后一个子元素

:only-child 匹配只有一个子元素的父元素的子元素

表单对象属性过滤选择器

:enabled 选取所有可用元素

:disabled 选取所有不可用元素

:checked 选取所有被选中元素(单选框,复选框)

:selected 选取所有被选中元素(下拉列表)

时间: 2024-12-29 12:14:17

jQuery学习之过滤选择器的相关文章

Jquery学习笔记-过滤选择器

1.根据某过滤规则进行元素的匹配,书写时以":"号开头,通常用于查找集合元素中的某一位置的单个元素. $("li:first") 第一个 $("li:last") 最后一个 2.如果想从一组标签元素数组中,灵活选择任意的一个标签元素,我们可以使用:eq(index) 其中参数index表示索引号(即:一个整数),它从0开始. 如果index的值为3,表示选择的是第4个元素:$("li:eq(3)") 3.按照文本内容来查找一个

jQuery之属性过滤选择器

转自:http://blog.csdn.net/woshisap/article/details/7341136 在HTML文档中,元素的开始标记中通常包含有多个属性(attribute), 在jQuery中,除了直接使用id和class属性作为选择器之外,还可以根据各种属性(如title等)对由选择器 查询到的元素进行过滤,属性过滤选择器包含了在中括号"[]"中,而不是以冒号开头,通常使用"选择器[属性过滤选择器]"语法格式,可以根据是否包含指定属性或者 根据属性

jQuery子元素过滤选择器

1 <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> 2 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 3 <html> 4 <head> 5 <!-- jQuery子元素过滤选择器 --> 6 &l

jQuery学习一(选择器)

一直在学习web前端的知识,学习jQuey也有一段时间了,想总结一下.这一章先来学习jQuery选择器的知识. 一.jQuery选择器的介绍 jQuery中的选择器完全继承了css的风格.利用jQuery选择器,可以非常快速和便捷的找出DOM元素,学习jQuery选择器是学习jQuery的基础,因为所有的行为都要在获取元素之后才能生效 二.jQuery选择器 1.基本选择器 基本选择器是最常用也是最简单的选择器,通过元素的id,class和标签名等来查找DOM元素 选择器 描述 返回 示例 #i

Jquery | 基础 | 属性过滤选择器

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" con

jQuery选择器之过滤选择器

      过滤选择器类似于CSS中的伪类选择器,以冒号开头.过滤选择器根据其过滤规则分为:基本过滤选择器.内容过滤选择器.可见性过滤选择器.属性过滤选择器.子元素过滤选择器.以及表单对象属性过滤选择器. 1.基本过滤选择器 名称        说明                                               举例 :first 匹配到第一个元素 查找表格的第一行:$("tr:first") :last 匹配到最后一个元素 查找表格的最后一行:$(&qu

黑马day16 子jquery&amp;子元素过滤选择器

此选择器主要对所选择的表单元素进行过滤 1.:enabled 用法: $("input:enabled")    返回值  集合元素 说明:匹配所有可用元素.意思是查找所有input中不带有disabled="disabled"的input.不为disabled,当然就为enabled啦. 2.:disabled 用法: $("input:disabled")    返回值  集合元素 说明:匹配所有不可用元素.与上面的那个是相对应的. 3.:c

JQuery学习笔记-基本选择器

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <style type="text/css"> div, span, p {     width: 140px;     height: 140px;     margin: 5px;     background

JQuery学习笔记-层次选择器

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <style type="text/css"> div, span, p { width: 140px; height: 140px; margin: 5px; background: #aaa; border: