详解jQuery选择器

大致介绍

终于开始了我的jQuery学习之路！感觉不能再拖了，要边学习原生JavaScript边学习jQuery

jQuery是什么？

jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设　计和Ajax交互。

jQuery的核心特性可以总结为：具有独特的链式语法和短小清晰的多功能接口；具有高效灵活的css选择器，并且可对CSS选择器进行扩展；拥有便捷的插件扩展机制和丰富的插件。jQuery兼容各种主流浏览器，如IE 6.0+、FF 1.5+、Safari 2.0+、Opera 9.0+等。（来自百度-_-）

jQuery对象和DOM对象

我们在编写脚本时，可能会同时用到原生JavaScript和jQuery，那么这时就会存在一些问题。要解决这些问题就先得认识jQuery对象和DOM对象

DOM对象：通过例如getElementById方法获取到DOM树中的元素就是DOM对象

jQuery对象：通过jQuery包装DOM对象后产生的对象

注意：jQuery对象和DOM对象不能使用对方的任何方法

 // 错误
 $('div').innerHTML;
 // 错误
 document.getELementsByTagName('div')[0].html();　

jQuery对象和DOM对象是可以互相转化的

jQuery对象转成DOM对象有两种方法：

1、[index]

 var $div = $('div');//jQuery对象
 var div = $div[0];//DOM对象

2、get(index)

 var $div = $('div');//jQuery对象
 var div = $div.get(0);//DOM对象

DOM对象转成jQuery对象有一种方法：$(DOM对象)

 var div = document.getELementsByTagName('div')[0];//DOM对象
 var $div = $(div);//jQuery对象

jQuery选择器

jQuery中的选择器完全继承了CSS的风格

逐一来看

基本选择器

改变id为div1的所有div的背景色

$('#div1').css('background','#bbffaa');

改变所有p标签和class为one的div的背景色

$('p,.one').css('background','#bbffaa');

层次选择器

选取div里的所有span元素

$('div span');

选取div下元素名是span的子元素

$('div > span');								 
 1/3    1 2 3 下一页 尾页