jquery学习(二)选择器

1.基本选择器

*:代表所有元素
#id:例如:$("#lastname"),id="lastname" 的元素
.class:例如:$(".intro"),所有 class="intro" 的元素
element:例如:$("p"),所有 <p> 元素

如果要同时选择多个元素,元素之间可以加逗号

$('.test, #test, h1')

2.层次选择器

$('parent child'):选择所有指定的子元素,不一定是直接子元素
$('parent > child'):选择直接子元素
$('prev + next'):选择下一个指定的兄弟元素,一定要是紧跟着的兄弟元素
$('prev ~ siblings'):选择后面指定的所有兄弟元素,不一定要紧跟着

3.基本过滤选择器

:first:选择指定元素的第一个元素,例如:$("p:first"),选择第一个p元素
:last:选择指定元素的最后一个元素,例如:$("p:last"),选择最后一个p元素
:not(selector):取非元素
:even:例如,$("tr:even"),所有偶数 <tr> 元素
:odd:选择奇数个元素
:eq(index):例如,$("ul li:eq(3)"),列表中的第四个元素(index 从 0 开始)
:gt(no):大于指定索引的元素
:lt(no):小于指定索引的元素

4.内容过滤选择器

:contains(text):搜索包含指定字符串的元素,子元素包含字符串也可以。例如:
$("div:contains('zjoops')").css('backgroundColor', 'yellow');

div的子元素包含该字符串,也会被选中

:empty:空元素(内容为空,且不包含子元素)
 $("div:empty").css('backgroundColor', 'yellow');

:has(selector):包含指定子元素

例如:

$("div:has(span)").css('backgroundColor', 'yellow');
选择包含span子元素的div元素

:parent:取包含子元素或文本的元素

5.可见性过滤选择器

 :hidden:取不可见元素(display:none)
 :visible:取可见元素

6.属性过滤选择器

[attribute]:拥有attribute属性的元素,例如:
$("div[class]").css('backgroundColor', 'yellow');
[attribute = value]:attribute属性值等于value的元素,也可以[attribute != value]
[attribute ^= value]:attribute属性值以value开头的元素
[attribute $= value]:attribute属性值以value结尾的元素
[attribute *= value]:attribute属性值包含value的元素
[attribute][attribute = value]:还可以进行联合选择,是且的关系

7.子元素过滤选择器

:first-child:匹配父元素的第一个子元素,如果该元素是第一个元素,则选中。例如:
$("li:first-child").css('backgroundColor', 'yellow');
:last-child:匹配父元素的最后一个子元素

:nth-child(n|even|odd|formula): 选择器选取属于其父元素的不限类型的第 n 个子元素的所有元素。
    n:要匹配的每个子元素的索引,必须是一个数字,第一个元素的索引号是 1。
    even:选取每个偶数子元素。
    odd:选取每个奇数子元素。
    formula:规定哪个子元素需通过公式 (an + b) 来选取。 实例:p:nth-child(3n+2) 选取每个第三段,从第二个子元素开始。
:only-child:选取属于其父元素的唯一子元素的每个元素。

8.表单元素选择器

:input:所有<input>元素
:text:所有type="text"的<input>元素
:password:所有type="password"的<input>元素
:radio:所有type="radio"的<input>元素
:checkbox:所有type="checkbox"的<input>元素
:submit:所有type="submit"的<input>元素
:reset:所有type="reset"的<input>元素
:button:所有type="button"的<input>元素
:image:所有type="image"的<input>元素
:file:所有type="file"的<input>元素

9.表单元素过滤选择器

:enabled:所有激活的input元素
:disabled:所有禁用的input元素
:selected:所有被选取的input元素
:checked:所有被选中的input元素
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
编译原理是计算机专业的一门核心课程,旨在介绍编译程序构造的一般原理和基本方法。编译原理不仅是计算机科学理论的重要组成部分,也是实现高效、可靠的计算机程序设计的关键。本文将对编译原理的基本概念、发展历程、主要内容和实际应用进行详细介绍编译原理是计算机专业的一门核心课程,旨在介绍编译程序构造的一般原理和基本方法。编译原理不仅是计算机科学理论的重要组成部分,也是实现高效、可靠的计算机程序设计的关键。本文将对编译原理的基本概念、发展历程、主要内容和实际应用进行详细介绍编译原理是计算机专业的一门核心课程,旨在介绍编译程序构造的一般原理和基本方法。编译原理不仅是计算机科学理论的重要组成部分,也是实现高效、可靠的计算机程序设计的关键。本文将对编译原理的基本概念、发展历程、主要内容和实际应用进行详细介绍编译原理是计算机专业的一门核心课程,旨在介绍编译程序构造的一般原理和基本方法。编译原理不仅是计算机科学理论的重要组成部分,也是实现高效、可靠的计算机程序设计的关键。本文将对编译原理的基本概念、发展历程、主要内容和实际应用进行详细介绍编译原理是计算机专业的一门核心课程,旨在介绍编译程序构造的一般原理和基本
好的,关于 jQuery 的事件,我可以和你分享一些学习笔记。 1. 绑定事件 在 jQuery 中,我们可以通过以下方式来绑定事件: ``` $(selector).event(function(){ // 事件处理程序 }) ``` 其中,`selector` 表示要绑定事件的元素,`event` 表示要绑定的事件类型,比如 `click`、`mouseover` 等等。事件处理程序则是在事件触发时要执行的代码块。 2. 多个事件绑定 我们可以通过 `on()` 方法来同时绑定多个事件: ``` $(selector).on({ event1: function(){ // 事件处理程序1 }, event2: function(){ // 事件处理程序2 } }) ``` 这样,当 `event1` 或 `event2` 中任意一个事件触发时,对应的处理程序都会被执行。 3. 解除事件 如果需要解除某个元素的事件处理程序,可以使用 `off()` 方法: ``` $(selector).off(event); ``` 其中,`event` 表示要解除的事件类型。如果不指定事件类型,则会解除该元素上所有的事件处理程序。 4. 事件委托 在 jQuery 中,我们可以使用事件委托来提高性能。事件委托是指将事件绑定到父元素上,而不是绑定到子元素上,然后通过事件冒泡来判断是哪个子元素触发了该事件。这样,当子元素数量较多时,只需要绑定一次事件,就可以监听到所有子元素的事件。 ``` $(selector).on(event, childSelector, function(){ // 事件处理程序 }) ``` 其中,`selector` 表示父元素,`event` 表示要绑定的事件类型,`childSelector` 表示要委托的子元素的选择器,事件处理程序则是在子元素触发事件时要执行的代码块。 以上是 jQuery 中事件的一些基本操作,希望对你有所帮助。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值