`

Jquery选择器获取

阅读更多
(1)基本对象获取
$("*")
获取所有对象

$("#element")
获取id为element的对象等同于document.getElementById(“element”);

$(".abc")
获取class为abc的对象

$("div")
获取html中所有的div元素

$("#a,.b,p")
获取id为a和class为b以及所有p元素

$("#a .b p")
获取id为a并且class为b元素下的p元素

(2)层级对象获取
$("div>input")
获取div下所有input对象

$("div+h")
获取紧跟在div后的一个h元素

$("div~p")
获取在元素div之后的所有p元素

(3)简单对象获取
$("element:first")
获取页面上某个元素的第一个如$("div:frist")表示第一个div

$("element:last")
获取页面上某个元素的最后一个如$("div:frist")表示最后一个div

$("element:not(selector)")
去除所有与选择器匹配的元素如$("input:not(:check)")表示所有未被选中的复选框

$("element:even")
获取element元素的偶数行

$("element:odd")
获取元素的奇数行

$("element:eq(index)")
获取特定索引的元素 如$("div:el(2)")表示第三个div

$("element:gt(index)")
匹配所有大于给定索引值的元素

$("element:lt(index)")
匹配所有小于给定索引的元素

$(":header")
匹配h标记的元素

$("element:animated")
匹配所有没有执行动画效果的元素

(4)内容对象的获取和对象的可见性
$("Element:contains(text)")
元素中的文本是否包含某个字母或字符串

$("Element:empty")
获得不包含文本或子元素的元素对象

$("Element:parent")
获得对象元素包含文本或子元素

$("Element:has(selector)")
匹配含有某个元素是否包含某个元素 如$("p:has(span)")表示所有包含span元素的p元素

$("Element:hidden")
匹配所有不可见元素,包括display:none 以及input的属性是hidden的元素

$("Element:visible")
匹配所有课件元素

(5)对象获取进阶
$("Element[id]")
获取所有带有id属性的元素

$("Element[attribute=abcd]")
获取所有某个属性为abcd的元素

$("Element[attribute!=abcd]")
获得所有某个属性不为abcd的元素

$("Element[attribute^=ab]")
获得所有某个属性以ab开头的元素

$("Element[attribute$=ab]")
获得所有某个属性以ab结尾的元素

$("Element[attribute*=ab]")
获得所有含有某个属性包含ab的元素

$("Element[selector1][selector2][.....]")
符合属性选择器 如$("input[id][name][value=abcd]")表示获得带有ID、Name以及value是abcd的input元素

(6)子元素的获取
$("Element:nth-child(index)")
选择父级下的第N个子元素,索引从1开始
:nth-child(even)偶数
:nth-child(odd)奇数
:nth-child(3n)表达式
:nth-child(2)索引
:nth-child(3n+1)表达式

$("Element:first-child")
父级下的第一个子级元素

$("Element:last-child")
父级下的最后一个子级元素

$("Element:only-child")
父级下的唯一的一个子级元素

(7)表单对象的获取
$(:input)
只能匹配input元素类型为 input button select  textarea

$(:text)
所有当行文本框

$(:password)
所有密码框

$(:radio)
所有单选按钮

$(:checkbox)
所有复选框

$(:submit)
所有提交按钮

$(:image)
所有图片域
$(:reset)
所有充值按钮

$(:button)
所有按钮

$(:file)
所有的文件上传域

$(:hidden)
所有不可见元素或者type为hidden的元素

$(:enabled)
所有可用input元素

$(:disabled)
所有不可用input元素

$(:checked)
所有复选框元素

$(:selected)
所有下拉表
(7)元素属性的设置与移除
$("Element").attr(name)
取得第一个匹配元素的属性值 如$("img").attr("src");

$("Element").attr({key:value,key:value,......})
为某一个元素一次性设置多个属性

$("Element").attr(key,value)
为某个元素设置属性

$("Element").attr(key,function)
为所有匹配的元素设置一个计算的属性

$("Element").removeAttr(name)
移除某一个属性
分享到:
评论

相关推荐

    PPT和案例\jQuery选择器

    但在jQuery中,尝试用选择器获取不存在的元素不会导致错误,而是返回一个空的jQuery对象。 总的来说,jQuery选择器的灵活性和易用性使得前端开发人员能够更高效地操作DOM,减少代码量,提高代码可读性和维护性。...

    Java模拟Jquery选择器

    本主题将深入探讨如何使用`org.htmlparser.Parser`这个Java库来模拟JavaScript中的jQuery选择器,以实现类似的页面元素查找功能。 `org.htmlparser.Parser`是HTMLParser项目的一部分,它是一个用于解析HTML文档的...

    jquery 选择器 描述

    在深入探讨jQuery选择器及其应用之前,我们先简要回顾一下jQuery是什么。jQuery是一个快速、简洁的JavaScript库,它的设计宗旨是“写得更少,做得更多”。它极大地简化了HTML文档遍历、事件处理、动画以及Ajax交互,...

    Jquery实验室的选择器工具

    **jQuery选择器工具详解** jQuery库是JavaScript中最广泛使用的库之一,它简化了DOM操作、事件处理、动画制作以及Ajax交互。在这个“jQuery实验室的选择器工具”中,我们将深入探讨jQuery选择器的强大功能,它是...

    基于jQuery选择器的整理集合

    jQuery选择器是jQuery库的核心部分,它提供了一种高效的方式来选取和操作DOM元素。这篇文章将对jQuery选择器进行深入的整理和介绍。 首先,jQuery选择器可以分为基本选择器、层级选择器、属性选择器、内容选择器...

    jQuery选择器选中最后一个元素,倒数第二个元素操作示例

    现在,我们要使用jQuery选择器来操作这些`<p>`元素。 ### 选取倒数第二个元素 选取倒数第二个元素时,我们可以利用jQuery的`.eq()`方法。`.eq()`方法接受一个索引值作为参数,返回匹配该索引的元素。由于...

    jquery双向选择器代码

    首先,理解jQuery选择器的基本概念是关键。jQuery提供了多种内置的选择器,如ID选择器(#id)、类选择器(.class)、元素选择器(element)等,它们用于定位HTML文档中的特定元素。双向选择器则在此基础上增加了更...

    jquery一些案列和一些选择器

    在提供的"jqueryEXC"压缩包中,可能包含了实际应用这些概念的案例,如使用选择器获取元素、执行DOM操作、创建动画效果等。通过研究这些案例,可以加深对jQuery的理解并提高实践能力。 通过掌握以上知识,你将能够...

    RIA应用开发:2-jquery选择器.ppt

    RIA 应用开发之 jQuery 选择器 jQuery 选择器是 RIA 应用开发中一个非常重要的概念, jQuery 选择器是 jQuery 库中的一部分,主要用来选择和操作 HTML 文档中的元素。下面是 jQuery 选择器的详细知识点: 1. ...

    jQuery商品价格选择器

    首先,我们要理解jQuery选择器的核心概念。jQuery选择器是用于选取HTML元素的工具,它基于CSS选择器,同时添加了一些扩展,使得我们可以更高效地定位和操作DOM元素。例如,`$("#myID")`用于选取ID为"myID"的元素,`$...

    jQuery学习资料之万能的选择器

    jQuery选择器是其强大之处,它们基于CSS选择器,但扩展了更多功能,允许更复杂的选取方式。以下是一些常见选择器: - **基本选择器**:`#id`(ID选择器)、`.class`(类选择器)、`tag`(标签选择器)和`*`(通用...

    使用jquery选择器如何获取父级元素、同级元素、子元素

    本文将深入探讨如何使用jQuery选择器获取父级元素、同级元素和子元素,这对于网页交互和DOM操作至关重要。 一、获取父级元素 jQuery提供了`parent([expr])`方法来获取元素的直接父元素。例如,如果你有一个`<a>`...

    jquery4种选择器

    本文将深入探讨jQuery中的四种主要选择器:ID选择器、标签选择器、类选择器和属性选择器。这些选择器是jQuery高效地定位页面元素的基础,让我们逐一了解它们。 首先,ID选择器是通过CSS的`#`符号来指定一个元素的...

    Jquery的基础问题

    JQuery选择器获取的DOM数组可以转换成JQuery对象,但本质上JQuery对象还是DOM数组,拥有DOM的属性和方法。 #### 3. JQuery API JQuery提供了丰富的API用于操作DOM,如读取和写入节点信息、增删节点、样式操作和...

    jQuery date_input日期选择器

    jQuery date_input日期选择器 发一JQUERY插件jQuery date_input,是日期选择器..... 这个选择器是我已经修改过的,官方下载的选择界面是英文的,然后我把它又汉化了一下..根据中国国情,又修改了日期格式!! 效果图演示...

    最容易学习的JQuery选择器说明文档

    ### 最容易学习的JQuery选择器说明文档 #### 前言 JQuery是一个轻量级的JavaScript库,因其简洁的语法和强大的功能而在前端开发领域广受欢迎。JQuery选择器是其核心功能之一,允许开发者轻松地选取网页中的DOM元素...

    jquery点击颜色选择器取值,颜色选择器

    本文将深入探讨如何使用jQuery实现一个模仿Photoshop颜色选择器的功能,以便在网页上进行在线颜色选取。 首先,理解颜色选择器的工作原理至关重要。颜色选择器通常包含HSV(色相、饱和度、亮度)或RGB(红、绿、蓝...

    jQuery实现多条件筛选

    2. **jQuery选择器与事件绑定**:使用jQuery选择器获取到这些元素,并绑定事件监听器,例如点击筛选按钮时执行的函数。 ```javascript $(document).ready(function() { $('#filterBtn').click(filterItems); }); ``...

    jquery 实现级联效果!

    2. **jQuery选择器**:使用jQuery选择器获取用户交互的元素。例如,我们可以使用`$("#category")`来获取类别下拉列表,`$("#subCategory")`获取子类别下拉列表。 3. **事件监听**:为需要响应用户选择的元素添加...

Global site tag (gtag.js) - Google Analytics