Jquery 入门

[align=center]

Jquery是一个非常优秀的Javascript库。其中封装了预定义对象和实用函数。还有像prototype，mootools等。
Jquery的优点
1、 轻量级
2、 强大选择器 3、出色DOM操作
4、可靠的事件处理机制 5、完善的Ajax
6、出色浏览器兼容性 7、链式操作

jQuery的构造函数接收四种类型的参数：
jQuery(expression,context)
jQuery(html) 页面
jQuery(elements) 元素
jQuery(fn) 函数


用法：[/b]

首先，引入Jquery JS文件

 
<!--引入jquery文件-->
        <script type="text/javascript" src="jquery-1.4.4.js">

简单的案例：加载HTML页面

  /**Jquery的页面载入事件处理方式*/
            $(document).ready(function(){
                alert("第一个JQuery案例");
			 }); 

或用下面方式写也对：

$( function(){
                alert("第一个JQuery案例");
			 }); 

DOM对象与Jquery对象之间的相互转换
一、 DOM对象转化成Jquery对象:$(DOM对象)
var $trs=$("div tr");
Jquery转化成DOM对象：在后面加【】或是调用get()方法
alert($("*").get(0).innerHTML);
alert($("*")【0】.innerHTML);
JQUERY选择器
简单说，选择器就是根据选择器字符串选择没的DOM对象，最后以Jquery包装集的形式返回。
JQuery选择器按照功能分：“选择”和“过滤”。

基础选择器：
匹配ID $(“#myID”)
匹配class $(“.myClass”)
Element匹配元素 $(“a”) 选择所有<a>标签
匹配所有元素 $(“*”)
匹配组合元素 $(“#myID,a,.myClass”)

层次选择器：
第一种：ancestor(祖先) descendant() $(“.bgRed div”)选择CSS类为bgRed的所有<DIV>元素
第二种：parent>child $(“.myList>li”) 选择CSS类为myList的直接子节点<li>元素
第三种：prev+next $(“.bg+img”) 选择CSS类为bg元素后面的img对象
第四种：prev+siblings $(“#frm~input”) 选择CSs id为frm元素后面所有input属性的元素

基本过滤器：
：first $(“tr:first”)查找表格的第一行
:last $(“tr:last”)查找表格的最后行
:not(selector) $(“input:not(:checked)”)选择所有未选中的input元素
:enen $(“tr:even”)索引值为偶数的元素从零开始
:odd $(“tr:odd”)索引值为奇数数的元素从零开始
:eq(index) 匹配一个给定索引值的元素 $(“tr:eq(1)”)表格第二行
:lt(index) 匹配小于索引值的元素 $(“tr:lt(3)”)表格第四行之前的的所有行
:gt(index) 匹配大于索引值的元素 $(“tr:gt(3)”)表格第四行之后的的所有行
:header 选择所有h1、h2一类的标题标签。

[b]用基本过滤器实现表格隔行換色效果
核心代码：

$(“tr:even”).css(“background-color”,”red”);奇数行
$(“tr:odd”).css(“background-color”,”blue”);偶数行

[/align]