本文为博主原创，未经允许不得转载：

1.jquery强大之处:
   容易上手,强大的选择器,解决浏览器的兼容
   完善的时间机制,出色的ajax封装,丰富的ui
   
2.jquery是一个javascript脚本库，不需要特别的安装，只需要我们在页面<head>标签内中，
  通过script标签引入jquery库即可。
  <script type="text/javascript" src="js/jquery-1.8.3.js"></script>

3.jquery对象与dom对象的区别

jquery对象与dom对象是不一样的,

通过一个简单的例子,简单来区分下dom对象与jquery对象:
   <p id="imooc"> </p>
  我们要获取页面上这个id为imooc的p元素，然后给这个文本节点增加一
  段文字：“您好！欢迎学习jquery”，并且让文字的颜色变成红色。

普通处理，通过标准的javascript处理
  var p = document.getElementById("imooc");
  p.innerHTML= '您好！欢迎学习jquery';
  p.style.coloe='red';

通过原生dom模型提供的decument.getElementById("imooc")方法获取的dom元素就是一个dom对象，
  再通过innerHTML与style属性处理文本与颜色。

jquery处理：
  var p = $("#imooc");
  p.html("您好，欢迎学习jquery").css('color','red');

通过$("imooc")方法会得到一个p的jquery对象，p是一个类数组对象，这个对象里面包含了dom对象
的信息，然后封装了很多操作方法，调用自己的方法html与css，得到的效果与标准的javascript处理
结果一致。

通过jquery方法包装后的对象，是一类数组对象，它与dom对象完全不同，唯一相似的是他们都能
操作dom。
 
   通过jquery处理dom的操作，可以让开发者更专注业务逻辑的开发，而不需要我们具体知道哪个dom
节点有哪些方法，也不需要关注浏览器的兼容问题，且代码也会更简洁。

4.jquery对象转化成dom对象
  jquery库本质上还是javascript代码，它只是对javascript语言进行包装处理，为的是提供更好
更方便快捷的dom处理与开发经常使用的功能。我们使用jquery的同时也能混合javascript原生代码
一起使用。在很多场景中，我们需要jquery与dom能够相互的转换，他们都是可以操作的dom元素，
jquery是一个类数组对象，而dom对象就是一个单独的dom元素。

如何把jquery对象转成dom对象？
 
  利用数组下标的方式读取到jquery中的dom对象
  html代码：
           <div>元素一</div>
           <div>元素二</div>
           <div>元素三</div>
  javascript代码：
   var div = $('div')  //jquery对象
   var div1 = div[0]   //转化成dom对象
   div1.style.color = 'red'  //操作dom对象的属性
   
   用jquery找到所有的div元素，因为jquery对象也是一个数组结构，可以通过下标索引找到第一个
div元素，通过返回的div对象，调用它的style属性，修改第一个div元素的颜色。这里需要注意的
一点是，数组的索引是从0开始的，也就是第一个元素下标是0.
 
  通过jquery自带的get()方法
  jquery对象自身提供一个.get()方法允许我们直接访问jquery对象中相关的dom节点，get()方法中
提供一个元素的索引：
   var div = $('div')  //jquery对象
   var div1 = div.get(0);   //通过get方法，转化成dom对象
   div1.style.color = 'red'  //操作dom对象的属性

其实我们翻开源码，看看就知道了，get方法就是利用的第一种方式处理的，只是包装成一个get
方法.

000000000000：：

jquery选择器值id选择器:

页面的任何操作都需要节点的支撑,开发者如何快速高效的找到指定的节点也是前端开发的一个重点.
jquery提供了一系列的选择器帮助开发者达到这一目的.让开发者可以更少的处理复杂选择过程与性能
优化,更多专注业务逻辑的编写.

id选择器:一个用来查找的id,即元素的id属性.

$("#id")

id选择器也是基本的选择器,jquery内部使用javascript函数document.getElementById()来处理id
的获取。原生语法的支持总是非常搞笑的，所以在操作dom的获取上，如果能采用id的话尽然考虑用
这个选择器。

注意：
      id是唯一的，每个id值在一个页面中只能使用一次。如果多个元素分配了相同的id，将只匹配该
id选择集合中的第一个dom元素。但这种行为不应该发生。有超过一个元素的页面使用相同的id是无效的。

111111111111：：
   
   jquery选择器值之类选择器
   
   类选择器，顾名思义，通过class样式类名来获取节点描述：
   
  $(".class");

类选择器，相对id选择器来说，效率相对会低一点，但是优势就是可以多选。
  同样的jquery事项，对于类选择器，如果浏览器支持，jquery使用javascript的原生getelementByClassName()
函数来实现的。

22222222222：：

jquery选择器之元素选择器

元素选择器：更具给定（html）标记名称选择所有的元素
   
   描述：  $("element");
   
   搜索指定元素标签名的所有节点，这个是一个合集的操作。同样的也有原生方法getelementByTagName（）
函数支持。
   var divs = document.getElementByTagName('div');
   得到页面所有的div元素。

333333333：：

jquery选择器之全选择器（*选择器）
    
    在css中，经常会在第一行写下这样一段样式：

*{padding:0px; margin :0px; }

通配符*意味着给所有的元素设置默认的编剧。jquery中我们也可以通过传递*选择器来选中文档页面中的元素。
   
    描述： $("*");

44444444444：：

jquery选择器之层级选择器

文档中的所有的节点之间都是有这样活着那样的关系。我们可以吧节点之间的关系可以用传统的
家族关系来描述。可以吧文档树当做一个家谱，那么节点与节点直接就会存在斧子，兄弟，祖孙的关系了。。

选择其中的层级选择器就是用来处理这种关系的
   子元素  后代元素  兄弟元素 相邻元素

通过一个列表，对比层级选择器的区别：

通过一个列表，对比层级选择器的区别

选择器                                描述
   $("parent > child")           子选择器：：选择所有指定“parent”元素中指定的“child”的直接子元素

$("ancestor descendant")     后代选择器：选择给定的祖先元素的所有后代元素，一个元素的后代可能是该元素的一个孩子，孙子等

$("prev +next")           相邻兄弟选择器：选择所有紧接在“prev”元素后的“next” 元素

$("prev ~ siblings")      一般兄弟选择器：匹配“prev”元素之后的所有兄弟元素，具有相同的父元素，并匹配过滤“siblings”选择器。

异同点：：

层级选择器都有一个参考节点。
   后代选择器包含了子选择器的选择的内容。
   一般兄弟选择器包含相邻兄弟选择器所选择到的元素，必须在同一个父元素下。。。

jquery及jquery常用选择器使用的更多相关文章

  1. JQuery的常用选择器 转

    JQuery的常用选择器 刚开始学JQuery写的如有错误欢迎批评指正 JQuery拥有的选择器可以让我们更快更方便找到想要的元素,然后对相应的元素进行操作 简单介绍一下一些常用的选择器: 1.基本选 ...

  2. jQuery常用选择器总结

    jQuery常用选择器总结: 我们都知道jQuery是JavaScript(JS)的框架,它的语法简单使用方便,被广大开发人员青睐.现在我就它常用的并且十分强大的选择器的方式,做一个总结.鉴于它的选择 ...

  3. js和jQuery常用选择器

    笔者觉得js是前台基础中的基础,而其选择器则是js基础中的基础,因长期使用框架导致js生疏,所有查资料,回顾一下js的常用选择器: 1.document.getElementById("id ...

  4. jquery 常用选择器和方法以及遍历（超详细）

    jQuery 常用选择器和和方法 学习总结 一.JQuery 介绍 1. 什么是 jQuery 2. jQuery 版本介绍 3. jQuery 文件介绍 二.jQuery 对象 1. jQuery ...

  5. 【学习笔记】锋利的jQuery（一）选择器

    一.要点阐述 1,jQuery创建于2006年1月的一个开源项目,强调理念是“write less,do more”,压缩后大小30KB左右.. 2,jQuery里的方法都被设计程自动操作对象集合,而 ...

  6. jQuery中的常用内容总结(一)

    jQuery中的常用内容总结(一)   前言 不好意思(✿◠‿◠),由于回家看病以及处理一些其它事情耽搁了,不然这篇博客本该上上周或者上周写的:同时闲谈几句:在这里建议各位开发的童鞋,如果有疾病尽快治 ...

  7. jQuery中的常用内容总结(三)

    jQuery中的常用内容总结(三) 转载请注明地址:http://www.cnblogs.com/funnyzpc/p/7571998.html 内容提要 选择器(第一节) 选择器的扩展方法(第一节) ...

  8. jQuery中的常用内容总结(二)

    jQuery中的常用内容总结(二) 转载请注明地址: http://www.cnblogs.com/funnyzpc/p/7571993.html 前言 距离上次博客更新已经有二十来天了(●′ω`●) ...

  9. Python全栈开发之路 【第十五篇】：jQuery的介绍和选择器

    本节内容 什么是jQuery? write less,do more. jQuery是一个快速,小巧,功能丰富的JavaScript库. 它通过易于使用的API在大量浏览器中运行,使得HTML文档遍历 ...

随机推荐

  1. 把本地windows系统上的mysql数据库移到linux系统服务器上，mysql数据库拒绝访问

    Mysql连接报错 原因是:远程服务器不允许你的其他程序访问它的数据库.所以,我们要对远程服务器进行设置,使它允许你进行连接. 步骤:一.进入mysql客户端,输入:use mysql; 二.输入:s ...

  2. 【Linux学习五】文本处理

    环境 虚拟机:VMware 10 Linux版本:CentOS-6.5-x86_64 客户端:Xshell4 FTP:Xftp4 一.cut:显示切割的行数据f:选择显示的列s:不显示没有分隔符的行d ...

  3. 利用python 数据分析入门，详细教程，教小白快速入门

    这是一篇的数据的分析的典型案列,本人也是经历一次从无到有的过程,倍感珍惜,所以将其详细的记录下来,用来帮助后来者快速入门,,希望你能看到最后! 需求:对obo文件进行解析,输出为json字典格式 数据 ...

  4. Java注解的原理

    自Java5.0版本引入注解之后,它就成为了Java平台中非常重要的一部分.开发过程中,我们也时常在应用代码中会看到诸如@Override,@Deprecated这样的注解.这篇文章中,我将向大家讲述 ...

  5. [转载] Web Service工作原理及实例

    一.Web Service基本概念   Web Service也叫XML Web Service WebService是一种可以接收从Internet或者Intranet上的其它系统中传递过来的请求, ...

  6. Java中this和super关键字

    今天练习到Java中的this和super关键字,我有如下总结: 1.子类继承父类,子类初始化对象,必须先调用父类构造方法,因为随时有可能要使用父类的成员变量. 2.get和set方法只是对成员变量进 ...

  7. MyBatis的核心配置、动态sql、关联映射（快速总结）

    MyBatis的核心对象和配置 #1. SqlSessionFactory对象: 单个数据库映射关系经过编译的内存镜像: 作用:创建SQLSession对象. //读取配置文件 InputSteam ...

  8. 数据库的增、删、改、查 (CURD)

    增改查删可以用CURD来表示  增加:create  修改:update   查找:read      删除:delete 增加create :  insert +表名+values+(信息): in ...

  9. django外使用django ORM

    import os, sys import django BASE_DIR = os.path.dirname(os.path.abspath(__file__)) # 定位到你的django根目录 ...

  10. bzoj2120 / P1903 [国家集训队]数颜色 / 维护队列（带修改莫队）

    P1903 [国家集训队]数颜色 / 维护队列 带修改的莫队 在原有指针$(l,r)$上又添加了时间指针$t$ 贴一段dalao的解释 带修改的莫队,和原版莫队相比,多了一个时间轴 原版莫队是将区间( ...