【嘉兴东臣php】jquery

摘要: 动画，DOM，ajax

总结 ：

又到了一周的总结时间，这个星期主要学习了jquery，中间还插了一天的贪吃蛇，这个星期的jquery学习相对来说比之前简单一点，毕竟jquery是基于javascript的， 主要内容有动画函数，DOM，ajax三块，关于这三大块的掌握情况，只能说单独做一个块还行，综合起来的话做的不太好。贪吃蛇的话，我只能说有毒。虽然后面用坐标的概念把整个做法看懂了，但是还是不能自己做出来。有毒。

jquery：

1.jquery是JS 中伟大的框架。使用简单。引用方法：<script type="text/javascript" scr="jquery文件"></script>

jquery，使用$()来表示对象，有三大选择器
1、$("#xxx") ID选择器
2、$(".xxx") Class选择器
3、$("input") 标签选择器
4、$("[href='xxxx']") 属性选择器

动画函数:
1、show 显示
2、hidden/hide 隐藏
3、toggle 显示和隐藏
4、fadeIn 淡入
5、fadeOut 淡出
6、fadeToggle 淡入和淡出
7、slideUp 向上滑动
8、slideDown 向下滑动

animate("执行的动画操作"，时间，可选(回调函数))
如：
$("").animate（{"height":"300px;"}, 1500）;

注意：加入position属性！

10.stop 停止动画
参数一：clearQueue:如果设置成true，则清空队列。可以立即结束动画。

参数二：jumpToEnd:如果设置成true，则完成队列。可以立即完成动画
如：stop(true, true);

DOM:

1、parent() 找到父节点

2、children() find() 找到子节点

注意：children 默认不加参数的时候为找第一个节点，加了找参数里的节点。如children("div.select")就是找div里的select的class类
find，一般用于找子节点的某个元素标签，如：find("div");

3、next() prev() 找到下一个节点 找到上一个节点
4、siblings 找到并获取所有的兄弟节点

5、eq(索引)找到元素中的某个索引，注意是从0开始的。
6、get(索引)匹配元素中的某个索引，注意不返回元素。
7、first() 通过自定义的找到，找到第一个元素。如：$(".a").first();就是找到class为a的第一个元素。

8、last() 同上，不过找到的是最后一个元素。

&
3ff0
nbsp; 9、append() 追加HTML内容

10、appendTo() 把所有匹配的元素追加到另一个指定的元素元素集合中。

11、remove() 移除，不会删除，占用位置

12、empty() 清空子元素

13、attr() 设置属性 、返回属性

bind() ,绑定事件。
unbind() 解绑事件。

如：$(".abc").bind("click",function(){

});
$(".abc").unbind();//如果unbind内部没有加入参数的话，移除所有的事件。

$(".abc").unbind("click")//如果unbind内部加了参数的话，移除就是当前参数的事件。

is() 判断标签 或者 选中的效果
比如: is('div'), is("input:checked")
hasClass 一般为判断元素是否有这个类
比如：hasClass("abc") 判断class里是否有abc这个类

.css(设置一个节点的样式)
.html(设置一个节点的HTML代码)
.text(设置一个节点的文本)

AJAX:

.load()
通过载入一个远程页面，用来放入到某个Dom中。
load 默认会返回2个参数，第一个是load页面的内容，第二个参数是返回状态 success为成功

.get()
通过Get请求方式，请求数据。

.getJson()
通过Get请求方式，请求数据并返回的是json数据文件，注意请求json文件！

.post()
通过Post请求方式，请求数据。
.ajax()
通过自定义请求方式，请求数据。
$.ajax({
url: "http://120.26.196.152/come.php",//URL
dataType: "json", //数据格式
async: true, //是否为异步
data: { "name": "ajax","age":"20" }, //参数值
type: "GET", //请求方式
success: function(req) {//请求成功时处理
console.log( req );
$("#message").text( req.name + "-" + req.age );
},
error: function(req){ //请求错误的时候的处理

}
});

变量class:<div class='btn"+i+"';></div>

var a="btn"+i;

$("."+a+"").





最后，希望下一周过的更好。