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]