《锋利的jQuery》学习笔记

《锋利的jQuery》学习笔记

1. if($(div).is('.class'))同 if($(div).hasClass('class'))
2. $(div).height($(div).height()+50) 同$(div).animate({height:'+=50'},400)
3. 事件命名空间 $(div).bind('click.namespace'),取消事件$(div).unbind('.namespace')
4. $(div).triggerHandler('focus')不同于$(div).trigger('focus'),不会获得焦点
5. $(div).addClass('test')同$(div)['addClass']('test'),因此可用变量$(div)[hasclass?'removeClass':'addClass']('test')
6. 让下拉框选中$(select).val(['text1','text2'])text1为option值
7. addClass('class')添加class，attr('class',class)会覆盖class
8. 删除元素$(li).remove() $(li:eq(2)).detach()
9. toggleClass()切换class,toggle()切换显示隐藏
10. 判断元素是否存在if($(div).length > 0 )
11. $('.one + div') 同$('.one').next('div'),$('.one ~ div') 同$('.one').nextAll('div')
12. $(div).click(functioin(){if($(this).is(':visible')) {$(this).next().hide();}else{$(this).next().show();}});同$(div).toggle(function(){$(this).next().hide();},function(){$(this).next().show();});也可直接 $(div).click(functioin(){$(this).next().toggle();});
13. 移动元素$(li).appendTo($ul)
14. slideToggle同slideUp,slideDown,fadeToggle同fadeIn,fadeOut
15. hover同mouseover,mouseout但其实绑定的是mouseenter,mouseleave事件，因此触发离开事件是trigger('mouseleave')
16. jquery插件方法可写在$.fn.extend({test:function(){}}) 或直接$.extend({test:function(){}})，注意其中的this为jq对象，而不是dom对象
17. $(form).searlize()将form对象序列化为字符串$(form).searlizeArray()转化为json对象$.param({name:'sf',age:1})转化为name=sf&age=1
18. 延迟触发delay(1000)
19. var str=$('p').map(function(){
    return $(this).text()
    }).get().join(',') 返回p标签所有的内容
20. $(:input) .attr('checked') 返回undefined
    $(:input) .prop('checked')返回true false
    $(:input) .prop('checked',true)
    $(:input) .removeProp('checked')取消选中