锋利的Jquery学习笔记之Jquery的选择器

Jquery的选择器分为:基本选择器,层次选择器,过滤选择器和表单选择器。

1.基本选择器

基本选择器是Jquery中最常用的选择器,也是最简单的选择器。

2.层次选择器

如果想通过DOM之间的层次关系来获取特定元素,例如后代元素,子元素,相邻元素和同辈元素等,那么层次选择器是一个非常好的选择。

在层次选择器中,第一个和第二个选择比较常用,而后面两个在JQuery里可以用更加简单的方法代替,所以使用的几率相对较小。

3.过滤选择器

过滤选择器主要是通过特定的过滤规则来筛选出所需的DOM元素,过滤规则与CSS中的伪类选择器语法相同,即选择器都是以一个冒号(:)开头。按照不同的过滤规则,过滤选择器可以分为基本过滤,内容过滤,可见性过滤,属性过滤,子元素过滤和表单对象属性过滤选择器。

3.1.基本过滤选择器

3.2.内容过滤选择器

内容过滤选择器的过滤规则主要体现在它所包含的子元素或文本内容上面。

3.3.可见性过滤选择器

可见性选择器是根据元素的可见和不可见来状态来选择相应的元素。

在可见性选择器中,需要注意选择器:hidden,它不仅包括样式属性display为"none"的元素,也包括文本隐藏域(<input type="hidden">)和visibility:hidden之类的元素。

3.4.属性过滤选择器

属性过滤选择器的过滤规则是通过元素的属性来获取相应的元素。

3.5.子元素过滤选择器

子元素过滤选择器的过滤规则要注意将元素的父元素和子元素区分清楚。

3.6.表单对象属性过滤选择器

表单对象属性过滤选择器主要是对所选择的表单元素进行过滤,例如选择被选中的下拉框,多选框等元素。

4.表单选择器

为了能够更加灵活的操作表单,jQuery中专门加入了表单选择器,利用这个选择器,能够及其方便地获取到表单的某个或某类型的元素。

时间: 2024-12-28 20:30:30

锋利的Jquery学习笔记之Jquery的选择器的相关文章

jQuery学习笔记之一——jQuery入门与基础核心

因为工作的原因,所以自学了下jQuery,这里以李炎恢老师的教程为自觉教程,并记录学习中遇到的问题. 教程下载地址: http://www.verycd.com/topics/2956408/ 课件下载地址: http://download.csdn.net/download/ip_kv3000/8986013 jQuery类库下载地址: http://jquery.com/ jQuery入门  优势.历史.版本我就不多说了,网上有的是.至于为什么学,因为很有用,为什么非要学他,因为微软加入到了

锋利的JQuery学习笔记之JQuery

今天终于看到了最令我兴奋的一章:JQuery与Ajax的应用.AJAX即"Asynchronous JavaScript and XML"(异步JavaScript和XML),AJAX并非缩写词,而是由Jesse James Gaiiett创造的名词,是指一种创建交互式应用的网页开发技术.在最初学习Ajax的日子里,我被ASP.NET AJAX框架提供的UpdatePanel迷惑了,以后Ajax就这么简单,所以在最初做的几个项目里,前台代码里必至少有一个UpdatePanel区域,把要

锋利的jQuery学习笔记之jQuery选择器

在介绍jQuery选择器之前,先简单介绍一下CSS选择器---> 一.CSS选择器 常见的CSS选择器有以下几种: 选择器 语法 描述 示例 标签选择器 E{CSS规则} 以文档元素为选择符 td{font-size:10px;} a{tetx-decoration:none;} ID选择器 #ID{CSS规则} 以文档元素的唯一标示ID为选择符 #node{corlor:red;} 类选择器 .className{CSS规则} 以文档元素的class作为选择符 div.node{backgro

jQuery学习笔记(三)jQuery中的动画

1 show() 方法和hide() 方法  (显示和隐藏) show() 方法和hide() 方法是jQuery中基本的动画方法.在HTML文档里,为一个元素调用hide() 方法,会将该元素的display样式改为“none”. $("element").hide(); //通过hide()方法将element元素隐藏 $("element").css("display","none"); //通过css()方法将elem

jQuery学习笔记之可见性过滤选择器

可见性过滤选择器是根据元素的可见和不可见状态来选择相应的元素. 显示隐藏的例子: <!DOCTYPE html> <html> <head> <script src="/jquery/jquery-1.11.1.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#hide

jQuery学习笔记之二——常规选择器

jQuery 最核心的组成部分就是: 选择器引擎. 它继承了 CSS 的语法, 可以对 DOM 元素的标签名. 属性名. 状态等进行快速准确的选择, 并且不必担心浏览器的兼容性. 简单选择器#box { //使用 ID 选择器的 CSS 规则color:red; //将 ID 为 box 的元素字体颜色变红}在jQuery 选择器里,我们使用如下的方式获取同样的结果: $('#box').css('color', 'red'); //获取 DOM 节点对象,并添加行为 选择器 CSS 模式 jQ

jQuery学习笔记(一)——选择器

常规选择器: 1.$('#box') ID选择器,获取一个ID为box的DOM对象 2.$('.box') CLASS选择器,获取一个class为box的DOM对象 3.$('div') 元素名选择器,获取一个元素名为div的DOM对象 进阶选择器: 1.$('div,#box,.box') 群组选择器,获取元素名为div.ID为box.class为box的DOM对象 2.$('div #box') 后代选择器,获取div中ID为box的DOM对象 另一种写法$('div').find('#bo

Jquery学习笔记-表单元素选择器

1. :input表单选择器可以实现,它的功能是返回全部的表单元素,不仅包括所有<input>标记的表单元素,而且还包括<textarea>.<select> 和 <button>标记的表单元素,因此,它选择的表单元素是最广的. $("#frmTest :input")表单选择器代码获取了表单中的全部元素 2. :text表单文本选择器可以获取表单中全部单行的文本输入框元素,单行的文本输入框就像一个不换行的字条工具,使用非常广泛. 通过:

jQuery学习笔记(9)--jquery中的事件--$(document).ready()

1.$(document).ready()方法是事件模块中最重要的一个函数,可以极大地提高web应用程序的相应速度. 2.执行时机:DOM就绪后就会执行,而javascript中window.onload方法是在网页中的所有元素(包括元素的所有关联文件)完全加载到浏览器后才执行. 3.可多次使用. 4.有简写的形式:$(function){} window.onload与$(document).ready()的比较: 1 <script src="Scripts/jquery-1.4.1.