JQuery in action 学习笔记

Jquery 方法

1、初始化加载 方法
$(document).ready(function(){
//执行代码
});
==
$().ready(function(){
//执行代码
});

==
$(function(){
//执行代码
});

2、根据id获取对象
$('#IdName');

3、根据标签名称获取对象 注意：没有引号 没有#号
$(objName);

4、给某对象添加样式类
$('#objName').addClass('className');

5、删除某对象样式类
$('#objName').removeClass('className');

6、绑定事件 bind()
$('#objName').bind('事件名称(如：click)', function(){执行操作});

7、简写事件
$('#objName').click(function(){执行操作});

8、toggle()两个方法之间转换调用， 同名效果(effect)
$('#objName').toggle(function(){执行方法一},function(){执行方法二});
例如：隐藏、显示
$('#objName').toggle(function(){$('#obj').hide();},function(){$('#obj').show();});

9、鼠标指针进入元素和离开元素时的操作 .hover();
$('#objName').toggle(function(){alert('鼠标进入');},function(){alert('鼠标离开');});

10、修改内联css
.css('property','value');
.css({property1:'value1', property2:'value2'});
获得对象样式里的某一项
$('#objName').css('fontSize');

11、基本的现实和隐藏 .show(); .hide();
$(objName).show();
$(objName).hide();
这两个方法都有三个参数 slow(0.6秒) normal(0.4秒) fast(0.2秒)
$(objName).show('slow');
还可以直接写数值,以毫秒为计算单位。注意:直接写数值不需要加引号
$(objName).show(1000);

12、淡入、淡出 fadeIn(); 也具有show(); 的三个参数值
$(objName).fadeIn();

13、多重效果
fadeIn(); 和 fadeOut(); 不透明度
fadeTo(); 不透明度
slideDown(); 和 slideUp(); 高度

14、自定义动画效果 animate();
参数：1、样式属性及值的映射 及.css();
2、可选速度参数
3、可选缓动(easing)参数
4、可选回调函数
例如：$(objName).animate({parame1:'value1', parame2:'value2'},speed, function(){alert();});

15、.attr()替换某一对象的属性
$(objName).attr({'id':'idValue', 'title':'titleValue'});

16、.each()方法类似for循环
例如遍历div下的某一类的所有连接
$('div.className a').each(function(index){index+1；执行操作});

17、 .insertAfter() .after .insertBefore() .before() 顾名思义向什么地方插入对象
$(document).ready(function(){
$('expression').insertAfter(objName);
})
如：向div对象后插入返回top的连接
$(document).ready(function(){
$('<a href="#top">back to top</a>').insertAfter('div.className objName');
$('<a id="top" name="top"></a>').prependTo('body'); //向body加入这个锚点
})
注：如果用alert() 则表达式 和对象名调换位置。

18、克隆对象.clone();包括内容，如果.clone(false);值复制标签
$(objName).clone();

19、在对象外部插入新元素用.warp();
$(objName).warp("content");

20、向某一对象里载入其他页面内容 .load();
$('#objId').load(x.html);

21、清空对象 .empty();
$(objName).empty();