jQuery 初学笔记

jQuery 初学笔记
1. jQuery概述 

- jQuery是一个优秀的JavaScript框架

主要提供如下功能: 访问页面框架的局部、修改页面的表现、更改页面的内容、响应事件、为页面添加动画、与服务器异步交互、简化常用的JavaScript操作

- 隔行变色的表格

　 - CSS的实现方法

　 - JavaScript的实现方法

      window.onload = function(){

        var otable = document.getElementById(tablename);

        for(var i=0;i<otable.rows.length;i++){

            if(i%2==0)

                otable.rows[i].className = “altrow(css样式)”;

        }

      }

　 - jQuery的实现方法

      $(function(){

          $(“table.datalest tr:nth-child(odd)”)

.addClass(“altrow(css样式)”);

        });

2. jQuery的“$”

- 选择器：$(“h2 a”)  <h2>content<a href=””>content</a></h2>

- 功能函数前缀：$.trim(stringvar);

- window.onload

　 - window.onload的冲突

　 - ready()方法

- 创建DOM元素: $(“<p>create an element.</p>”);

3. 选择器

- 属性选择器: $(“ul li:has(a)”).addClass(“classname”);

- 位置选择器: $(“li:lt(2)”).addClass(“classname”);

4. 动态切换CSS类：toggleClass(“classname”);

如标记中已有classname样式则删除此样式，否则就添加。

5. 页面的元素

- 直接获取、编辑内容

  html()获取包括标记和文本的内容；text()只获取纯文本内容。

- 克隆元素clone()

6. 页面的动态效果

1> 渐入渐出的变幻

- 再探show(3000)和hide(1000)；3000和1000为时间参数

- fadeIn()和fadeOut()。

2> 幻灯片效果

 slideUp()和slideDown()来模拟PPT中的类似幻灯片拉窗帘的特效

7. jQuery的功能函数

1> 浏览器的检测: $.browser对象

2> 盒子模型

- 标准盒子模型

- IE盒子模型

- $.boxModel对象

- DOCTYPE声明

3> 处理JavaScript对象

- $.each()遍历

$.each(object,fn);  获取未知对象的信息

- 数据过滤: $.grep()

- 数组的转化: $.map()

8. jQuery与Ajax

1> 获取异步数据

- jQuery的load()方法

2> GET VS. POST

- $.get(url, [data], [callback])

- $.post(url, [data], [callback],[type])

3> 控制Ajax

- 设置Ajax的细节 : $.ajax(options)

- 全局设定Ajax : $.ajaxSetup(options)

9. jQuery插件

1> 表单插件

 表单插件（Form Plugin）是一款功能非常强大的插件，下载后为jquery.form.js文件。该插件提供获取表单数据、重置表单项目、使用Ajax提交数据等一系列功能。

2> UI插件

 UI插件是jQuery中十分流行的插件之一，主要的原因在于它能够让开发者轻松的实现很多特效。