jquery 1.3.2 study 附实例

以下为对15天学习jquery的学习与总结,将一些内容精简合并,甚至与版本1.3.2兼容。这个过程参考了一下三个主要网站:
http://15daysofjquery.com/
http://wiki.jquery.org.cn/doku.php?id=jquery%E4%B8%AD%E6%96%87%E6%8C%87%E5%AF%BC:15%E5%A4%A9%E5%AD%A6%E4%BC%9Ajquery_2#fn__1
http://www.cnjquery.com/html/JQueryjiaocheng/200807/02-1.html

附件内有详细例子以及发上来的说明

第一天:hello jquery

知识点:

$(document).ready(fn);

第二天:双色表格

知识点:

强大的获取dom对象方式:$(".stripe tr")

给对象添加事件:obj.mouseover(fn).onmouseout(fn)

添加样式:$(this).addClass("over");

删除样式:$(this).removeClass("over")

第三天:ajax应用

知识点:

删除节点:$('p.rm').remove();

ajax发送post请求:$.post(url, data, callback, type)

ajax发送get请求:get(url, data, callback, type)

插入内容:obj.html(txt);

动画下拉效果:obj.slideDown("slow");

动画效果:obj.slideDown("slow");必须将obj设置为隐藏,即:display=none,否则看不到效果

$.post(url, data, callback, type)可以替换成get(url, data, callback, type) 其他参数不解释什么了,说一下里面的type:json,xml等也就是返回的数据类型如果是json,可直接data.name获取对应的值更多ajax调用方式可以参考以下页面:
http://jquery.com/demo/ajax/

第四天:包裹dom

知识点:

将obj包裹到html/elem的中心:obj.wrap(html/elem)

添加对象为obj第一节点:obj.prepend(html/elem)

添加对象为obj最后节点:obj.append(html/elem)

通过wrap将对象包裹到参数对象的中心位置,后面参数内的“+”号为连接符号,不是什么特殊意义,也可以直接传一个对象进度如:wrap(${#abc})


第五天:遍历操作(selectors)

知识点:

强大的selectors,搜索li标签下class属性包含lis内容的节点对象:$('li[class*=lis]')

针对对象集合进行遍历操作:objs.each(function(i)

cookies操作:...

遍历dom并且修改dom,通过selectors:$('li[class*=lis]')注意,原来的15天学习jquery中的例子在新版本中已无须 @符号($('li[@class*=lis]')),大家可以看一下selectors的api就可以了:http://docs.jquery.com/DOM/Traversing/Selectors
实例:http://docs.jquery.com/Selectors/attributeContains#attributevalue


第六天:实例、插件

经过前几天的学习,jquery就能作简单的应用了,下面几天主要讲了一些实际的例子, 其实也无非是通过jquery进行dom的操作,没什么特殊的东西,在我看来下面要作的是了解 jquery的api,以及ui plugin 然后在看看他的源码(当然我功力尚浅,所以...),jquery的api还是不错的,下面是中文的下载地址:
http://code.google.com/p/jquery-api-zh-cn/downloads/list

http://wiki.jquery.org.cn/doku.php?id=jquery%E4%B8%AD%E6%96%87%E6%8C%87%E5%AF%BC:15%E5%A4%A9%E5%AD%A6%E4%BC%9Ajquery_3
上面地址说了一些实例,可以都看一下效果,扫一下代码思路,用到了再具体研究。

jquery的代码分析: http://jljlpch.iteye.com/blog/234218
jquery的中文文档等下载: http://code.google.com/p/jquery-api-zh-cn/
官方网站: http://jquery.com/
中文社区: http://bbs.jquery.org.cn/index.php

你可能感兴趣的:(jquery,PHP,Ajax,json,Google)