总结一下jQuery的选择器使用。当然,这部分内容有些是通过网络进行查找来完成的。
jQuery选择器的分类
(1)基本选择器
(2)层次选择器
(3)基本过滤选择器
(4)内容过滤选择器
(5)可见过滤选择器
(6)属性过滤选择器
(7)表单对象属性过滤选择器
(8)表单选择器
/**===============================================================**/
基本选择器应用,它是使用jQuery的核心。可以说选择器是jQuery中非常重要的一部分。基本选择器使用非常简单,它的语法结构非常类似于CSS语法结构,只要有一定的CSS基础,对于新手上路是比较容易的。
基本选择器使用有如下几种常用的语法
(1)、$(“#id”):根据给定id匹配一个元素
例如:
html代码:<input type="button" id="btn1" value="按钮"></input>
jQuery代码:$("#btn1").val(); //找到id值为“btn1”的html元素,并求出此html元素的值
(2)、$(“.class”):根据给定的类名匹配元素
例如:
html代码:<input type="button" class="btn1" value="按钮"></input>
jQuery代码:$(".btn1").val(); //找到class属性值为“btn1”的html元素,并求出此html元素的值
(3)、$(“*”):选取所有的元素
例如:
html代码:<body>...</body>
jQuery代码:$("*").css("background", "red"); //获取html中所有的元素,并将所有元素的背景色设置为红色
(4)、$(“div,span,p,.myclass”):选取所有<div>、<span>、<p>、<myclass>一组元素
例如:
html代码:<div>一个div元素</div><span>一个span元素</span><p>一个p元素</p>
jQuery代码:$(“div,span,p,.myclass”).css("background","red"); //获取div、span、p、.mylcass元素,并将它们的背景色设置为红色
/**===============================================================**/
层次选择器应用,如果想根据html元素之间的层级关系来查找html元素,那么就可以使用层次选择器
层次选择器使用有如下几种常用的语法
(1)、$(“div span”):选取<div>下面的所有<span>元素,包括后代元素
(2)、$(“div > span”):选取<div>元素下面所有<span>子元素,不包括后代元素
(3)、$(“.one + div”):选取class为one的下一个<div>兄弟元素,即紧接在.one元素后的div元素
(4)、$(“#one ~ div”):选取id为one的元素之后的所有同辈<div>兄弟元素
层次选择器大家可以通过附件下载源码进行学习。谢谢
/**===============================================================**/
基本过滤选择器,它可以根据元素的索引、元素是否在执行动画效果、判断元素是否是<h1>~<h6>标签来查找所要的元素对象。
层次选择器使用有如下几种常用的语法
(1)、$(“div:first”)选取所有<div>元素中第1个<div>元素
(2)、$(“div:last”)选取所有<div>元素中最后1个<div>元素
(3)、$(“div:not(.one)”)选取class不是one的<div>元素
(4)、$(“div:even”)选取索引是偶数的<div>元素
(5)、$(“div:odd”)选取索引时奇数的<div>元素
(6)、$(“div:eq(1)”)选取索引为1的<div>元素
(7)、$(“div:gt(3)”)选取索引大于3的<div>元素
(8)、$(“div:lt(3)”)选取索引小于3的<div>元素
(9)、$(“:header”)选取网页中所有的<h1>、<h2>、<h3>……
(10)、$(“div:animated”)选取正在执行动画的<div>元素
分享到:
相关推荐
Jquery选择器; 基本选择器;jQuery选择器;jQuery选择器; 层级选择器;jQuery选择器;;; 筛选选择器;jQuery选择器;jQuery选择器;jQuery选择器;jQuery选择器;jQuery选择器;jQuery选择器; 排他思想;jQuery选择器;jQuery...
Jquery选择器,Jquery选择器Jquery选择器Jquery选择器Jquery选择器Jquery选择器
jquery 选择器 描述
jQuery选择器速查表,包括了jQuery的基本选择器、层次选择器、过滤选择器、表单选择器,方便以后查找。
jQuery选择器全解.
jQuery选择器大全(48个代码片段 21幅图演示)
jQuery选择器过滤器全面的总结,老师推荐!
jQuery选择器大全(48个代码片段+21幅图演示)
经典的jQuery选择器应用例子,直观的演示了各种选择器的应用例子。对学习jQuery很有帮助。
JQuery选择器详解JQuery选择器详解
Jquery选择器分类整理,基本都包含到了,学习笔记。
JQuery 选择器,方便 使用的技术
jquery初学者必备,有各种jquery的选择器,个人学习时整理
这是一份比较全面的jQuery选择器基础知识,包括源代码和相应的ppt,供大家分享
jQuery选择器总结,网上下载的,非原创的,仅供参考,学习学习。
jquery选择器功能无比强大,用好了可以起到事半功倍的效果,这个资源把选择器单独列出来,便于方便查找
JQ 选择器大全包含:基本选择器,层级选择器,层级函数,过滤选择器,内容选择器,可见选择器,jq中显示相关的函数,属性选择器,子元素选择器,表单选择器。里面的练习题可以拿来练手
jQuery选择器分为基本选择器、层次选择器、过滤选择器和表单选择器。
jQuery时间选择器点击选择小时分钟代码
现在我们开始Jquery的选择器之旅哈哈。 下面的选择器分类中, 带有“过滤器”的分类表示是“过滤”选择器, 否则就是“选择”功能的选择器。 jQuery选择器分为如下几类: [说明]