1.属性过滤选择器
选择器 | 描述 | 示例 |
[attribute] | 选取拥此属性的选择器 | $('div[id]') |
[attribute=value] | 选取属性值为value的元素 | $('div[color=red]') |
[attribute!=value] | 选取属性值不为value的元素 | $('div[color!=red]') |
[attribute^=value] | 选取属性值以value开始的元素 | $('div[titile^=text]') |
[attribute*=value] | 选取属性值以value结束的元素 | $('div[title*=text]') |
[attribute|=value] | 选取属性的前缀为value的元素 | $('div[title|=en]') |
[attribute~=value] | 选取属性用空格分割的值中含有value的元素 | $('div[titile~=uk]') |
[attribule1][attribule2] | 选取复合属性的选素 | $('div[color][name]') |
二.子元素过滤选择器
1.
:nth-child(even)选取父类元素下索引为偶数的元素
:nth-child(odd)选取父类元素下索引为奇数的元素
:nth-child(2)选取父类元素下索引为2的元素
:nth-child(3n)选取父类元素下索引为3的倍数的元素
:nth-child(3n+1)选取父类元素下索引为3n+1的元素
2.
:first-child选取父类元素的第一个子元素.
:last-child选取父类元素的最后一个子元素.
:only-child选取父类元素唯一的子元素.
例
$('div.one:only-child') .css('background','red')//选取父类元素one中唯一子元素,改变他的背景色
三.表单对象属性过滤选择器
选择器 | 描述 | 示例 |
:enabled | 选取所有可用元素 | $('#form1:enable');选取id为‘form’的表单可用元素 |
:disable | 选取不可用元素 | $('#form1:disable');选取id为‘form’的表单不可用元素 |
:checked | 选取所有被选中的元素(单选框,复选框) | $('input:checked');选取被选中的input元素 |
:selected | 选取所有被选中的选项元素(下拉框) | $('select :selected')选取下拉框中所有被选中的元素 |
四:表单对象属性过滤示例
选择器 | 描述 | 示例 |
:input | 选取所有<input><texarea><select><button>元素 | $(':input') |
:text | 选取所有单行文本框 | $(':text') |
:password | 选取所有密码框 | $(':password') |
:radio | 选取所有单选框 | $(':radio') |
:checkbox | 选取所有多选框 | $(':checkbox') |
:submit | 选取所有提交按钮 | $(':submit') |
:image | 选取所有图片按钮 | $(':image') |
:reset | 选取所有重置按钮 | $(':reset') |
:button | 选取所有按钮 | $(':buttom') |
:file | 选取所有上传域 | $(':file') |
:hidden | 选取所有不可见元素 | $(':hidden') |
相关推荐
通过以上这些知识点的学习,可以更好地理解如何使用JQuery选择器来操作和处理DOM中的元素,从而提高Web开发效率。掌握这些选择器不仅有助于编写更高效的代码,还能帮助开发者更好地理解JQuery的工作原理。
总结,JQ表单对象属性过滤选择器是jQuery中用于高效选取和操作表单元素的强大工具。熟练掌握它们,能让你在处理DOM操作时更加游刃有余,提高代码质量和开发效率。通过学习和实践,你将能够灵活运用这些选择器解决...
在本例中,我们关注的是jQuery中的表单对象属性过滤选择器,这些选择器专门用于筛选表单元素,如输入(input)、复选框(checkbox)、单选按钮(radio)以及下拉列表(select)的选项(option)。以下是对这些选择器的详细说明...
### jQuery选择器与过滤器深度解析 在前端开发领域,jQuery因其简洁的语法和强大的功能,长期以来备受开发者青睐。其中,选择器与过滤器作为jQuery的核心功能之一,为DOM操作提供了极大的灵活性和便利性。本文将对...
### jQuery选择器详解 在网页开发中,jQuery作为一款轻量级、功能强大的JavaScript库,极大地简化了HTML文档遍历、事件处理、动画以及Ajax交互等操作。其中,选择器是jQuery的核心特性之一,它提供了丰富的语法来...
选择器按功能分为基础选择器、层次选择器、属性选择器、表单选择器、可见性选择器、位置选择器、子元素选择器、内容选择器、属性选择器、表单对象属性选择器以及过滤选择器。每类选择器都有其独特的应用场景,熟悉并...
本文实例讲述了jQuery表单对象属性过滤选择器。分享给大家供大家参考,具体如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>2-11<...
jQuery选择器是jQuery库的核心特性之一,它极大地简化了JavaScript中的DOM元素选择和操作。jQuery完全继承了CSS的风格,并在此基础上提供了更强大和灵活的选择方式。以下是对jQuery选择器的详细说明: **1. 基本...
前面jQuery内容过滤选择器与子元素过滤选择器,其中的例子稍微多一些解释也有点绕口,希望能帮助大家理解。今天学习表单元素过滤选择器,下面请看使用方法。 一、:enabled 选择器::enabled 描述:匹配所有可用元素 ...
最后,表单选择器如`:$(":input")`选取所有输入元素,`:$(":text")`选取所有文本输入框,`:$(":radio")`选取所有单选按钮等,方便我们对表单元素进行操作。 通过上述的练习题,你可以实践并巩固这些选择器的用法。...
综上所述,jQuery选择器提供了一套强大且灵活的工具,帮助开发者高效地选择和操作DOM元素。无论是简单的元素选择还是复杂的条件过滤,都能轻松实现。在实际开发过程中,合理运用这些选择器可以极大地提高代码的效率...
按照过滤规则的不同,我们通常把jQuery过滤选择器分为:基本过滤、属性过滤、内容过滤、子元素过滤、表单对象属性过滤、可见性过滤等。今天我们主要学习一下其中的“基本过滤选择器”。 一、:first 选
**jQuery表单选择器源码解析** jQuery是一个广泛使用的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理、动画效果以及Ajax交互。在jQuery中,表单选择器是用于高效地定位和操作HTML表单元素的重要工具...
3. **表单选择器**:专门用于选取表单元素,如`$(":input")`选取所有输入元素,`$(":text")`选取文本输入框,`$(":checked")`选取已勾选的复选框或单选按钮。 4. **层次选择器**:用于选取基于元素间关系的元素。子...
简单过滤选择器是过滤选择器中使用最广泛的一种 jQuery选择器详解 根据所获取页面中元素的不同,可以将jQuery选择器分为:基本选择器、层次选择器、过滤选择器、表单选择器四大类。其中,在过滤选择器中有可以分为:...
根据元素中的文字内容或所包含的子元素特征获取元素,其文字内容可以模糊或绝对匹配进行元素定位 jQuery选择器详解 根据所获取页面中元素的不同,可以将jQuery选择器分为:基本选择器、层次选择器、过滤选择器、表单...
内容过滤选择器选择元素,可见性过滤选择器选择元素,属性过滤选择器选择元素,子元素过滤器选择元素,通过表单对象属性过滤选择器获取表单对象,创建DOM页面文档,冒泡方法,bind方法,hover方法,toggle方法,...
#### 表单对象属性过滤选择器:控制表单元素状态 这些选择器专为表单设计,帮助处理用户输入的状态: - `:enabled`和`:disabled`选取启用或禁用的元素。 - `:checked`选取已选中的单选或复选框。 - `:selected`选取...