Jquery最核心的组成部分就是选择器引擎。他继承了CSS的语法,可以对DOM元素的标签名、属性名、状态等进行快速、精确的选择,并且不必担心浏览器的兼容性。Jquery选择器除实现了基本的标签选择外,还提供了各种特殊的选择。

一、基本选择器:

对于获取的元素的个数我们可已通过两个方法来获取

       

      $("div").size();
    $("div").length();

  

二、进阶选择器:

        

三、层次选择器:

         

在兼容CSS选择器模式的同时下,Jquery又自定义了独特的方法进行DOM对象的选择。具体方法如下:

  

$('#box').children('p').css('color','red');   //等同于子选择器
$('#box').next('p').css('color','red'); //等同于同级下一个元素
$("#box").nextAll('p').css('color','red'); //等同于同级所有下面的元素
$("#box").prev('p').css('color','red'); //等同于同级上一个元素
$("#box").prevAll('p').css('color','red'); //等同于同级所有下面的元素
$("#box").prevUntil('p').css('color','red'); //等同于同级上非指定元素选定,遇到则停止
$("#box").nextUntil('p').css('color','red'); //等同于同级下非指定元素选定,遇到则停止
$("#box").siblings('p').css('color','red'); //等同于同级上下所有元素

四、属性选择器:

    

Jquery入门之----------选择器-------------的更多相关文章

  1. jQuery入门(1)jQuery中万能的选择器

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

  2. jQuery入门(2)使用jQuery操作元素的属性与样式

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

  3. jQuery入门(3)事件与事件对象

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

  4. jQuery入门(4)jQuery中的Ajax应用

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

  5. JQuery入门

    JQuery入门 1 jQuery的概述 1.1 jQuery简介 jQuery是一个 JavaScript函数库,它是一个“写的更少,但做的更多”的轻量级 JavaScript 库.jQuery 极 ...

  6. jQuery入门必须掌握的一些API

    jQuery 中文版文档:http://www.css88.com/jqapi-1.9/category/ajax/ jQuery入门,必须掌握以下的API,平时工作中经常会用到.未列出的API,在掌 ...

  7. Web前端JQuery入门实战案例

    前端jquery入门到实战 为什么要学习Jquery?因为生活. 案例: <!DOCTYPE html> <html lang="zh-CN"> <h ...

  8. 第一百六十二节,jQuery入门介绍

    jQuery入门 学习要点: 1.什么是  jQuery 2.学习 jQuery的条件 3.jQuery的版本 4.jQuery的功能和优势 5.其他 JavaScript库 6.是否兼容低版本  I ...

  9. JQuery入门篇

    JQuery入门篇 jQuery选择器 “$”表示JQuery对象 根据ID查找 $(‘#var’)表示将一个id值为var的DOM节点封装成一个jQuery对象,DOM节点必须以“#”开头. 例如: ...

随机推荐

  1. 如何让div水平居中

    代码实例: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...

  2. mongodb 查询使用

    > db.jd_58tc_raw.findOne() { "_id" : "2659e4e4caf0504ec4362478e2ed57ca", &quo ...

  3. ubuntu 16.04 64bit安装 Julia

    sudo add-apt-repository ppa:staticfloat/juliareleases sudo add-apt-repository ppa:staticfloat/julia- ...

  4. win xp32位与64位怎么查看是多少位系统

    方法一: Windows XP/Server2003几乎都是32位的操作系统 1. 单击“开始”,然后单击“运行”. 2. 在“打开”框中,键入cmd(再键入systeminfo)或者winmsd.e ...

  5. struts (三)

    1. <action name="test" class="com.gc.Test"> <result name="success& ...

  6. affine transformation matrix 仿射变换矩阵 与 OpenGL

    变换模型是指根据待匹配图像与背景图像之间几何畸变的情况,所选择的能最佳拟合两幅图像之间变化的几何变换模型.可采用的变换模型有如下几种:刚性变换.仿射变换.透视变换和非线形变换等,如下图: 参考: ht ...

  7. windows 下使用 zip安装包安装MySQL 5.7

    以下内容参考官方文档:http://dev.mysql.com/doc/refman/5.7/en/windows-start-command-line.html 解压缩zip到D:\mysql-5. ...

  8. linux驱动学习之Input输入子系统

    以前,看过国嵌关于input子系统的视频课程,说实话,我看完后脑子里很乱,给我的印象好像是input子系统驱动是一个全新的驱动架构,疑惑相当多.前几天在网上,看到有很多人介绍韦东山老师的linux驱动 ...

  9. Servlet(Response,Request)

    1.response控制码表的3种方法:输出1; 2,文件下载 3.控制浏览器定时刷新网页(REFRESH) 4.控制浏览器缓存当前文档内容 5. 通过response实现请求重定向. 6.setHe ...

  10. iOS 模态视图

    模态视图不是专门的某个类,而是通过视图控制器的presentViewController方法弹出的视图,我们称为模态视图. 模态视图出现的场景一般是临时弹出的窗口,譬如:登录窗口: 模态视图弹出时通过 ...