资讯专栏INFORMATION COLUMN

《锋利的jQuery》学习笔记

ConardLi / 678人阅读

摘要:同同事件命名空间取消事件不同于不会获得焦点同因此可用变量让下拉框选中为值添加,会覆盖删除元素切换切换显示隐藏判断元素是否存在同同同也可直接移动元素同同同但其实绑定的是事件,因此触发离开事件是插件方法可写在或直接,注意其中的为对象,而不是对象

if($(div).is(".class"))if($(div).hasClass("class"))

$(div).height($(div).height()+50) 同$(div).animate({height:"+=50"},400)

事件命名空间 $(div).bind("click.namespace"),取消事件$(div).unbind(".namespace")

$(div).triggerHandler("focus")不同于$(div).trigger("focus"),不会获得焦点

$(div).addClass("test")$(div)["addClass"]("test"),因此可用变量$(div)[hasclass?"removeClass":"addClass"]("test")

让下拉框选中$(select).val(["text1","text2"])text1为option值

addClass("class")添加class,attr("class",class)会覆盖class

删除元素$(li).remove() $(li:eq(2)).detach()

toggleClass()切换class,toggle()切换显示隐藏

判断元素是否存在if($(div).length > 0 )

$(".one + div") 同$(".one").next("div"),$(".one ~ div") 同$(".one").nextAll("div")

$(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();});

移动元素$(li).appendTo($ul)

slideToggle同slideUp,slideDown,fadeToggle同fadeIn,fadeOut

hover同mouseover,mouseout但其实绑定的是mouseenter,mouseleave事件,因此触发离开事件是trigger("mouseleave")

jquery插件方法可写在$.fn.extend({test:function(){}}) 或直接$.extend({test:function(){}}),注意其中的this为jq对象,而不是dom对象

$(form).searlize()将form对象序列化为字符串$(form).searlizeArray()转化为json对象$.param({name:"sf",age:1})转化为name=sf&age=1

延迟触发delay(1000)

var str=$("p").map(function(){
return $(this).text()
}).get().join(",") 返回p标签所有的内容

$(:input) .attr("checked") 返回undefined
$(:input) .prop("checked")返回true false
$(:input) .prop("checked",true)
$(:input) .removeProp("checked")取消选中

第一次写博客,有错误请指出,轻拍

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/78071.html

相关文章

  • 锋利jQuery学习心得

    摘要:熟悉了插件的组织结构以及比较统一的修改和学习方法。项目结束后,抽时间专门学习的进一步知识。对于选择器的性能,自己在看到了类似问题无人回答,好奇之下自己测试了与的速度,并被网友指出使用不当。 智营销项目中开始尝试使用jQuery并获得了很大的帮助,项目结束之后专门花时间认真看本书,配合网上搜索的一些知识和源码,收获很大。首先就是在项目中实战边学边用了DOM的系列操作,并踩了JQ attr...

    focusj 评论0 收藏0
  • 26天学通前端开发(配资料)

    摘要:网上有很多前端的学习路径文章,大多是知识点罗列为主或是资料的汇总,数据量让新人望而却步。天了解一个前端框架。也可以关注微信公众号晓舟报告,发送获取资料,就能收到下载密码,网盘地址在最下方,获取教程和案例的资料。 前言 好的学习方法可以事半功倍,好的学习路径可以指明前进方向。这篇文章不仅要写学习路径,还要写学习方法,还要发资料,干货满满,准备接招。 网上有很多前端的学习路径文章,大多是知...

    blair 评论0 收藏0
  • 2017-08-28 前端日报

    摘要:前端日报精选译高阶函数利用和来编写更易维护的代码,从入门到放弃响应式编程入门行的电梯调度模拟器个人分享前端学习资源分享中文周刊技术周刊期知乎专栏中的内置方法知乎专栏中的柯里化前端大宝剑小结常见知识依赖收集掘金项目主域重 2017-08-28 前端日报 精选 【译】高阶函数:利用Filter、Map和Reduce来编写更易维护的代码Webpack 3,从入门到放弃响应式编程入门:50 行...

    xumenger 评论0 收藏0
  • 前端相关大杂烩

    摘要:希望帮助更多的前端爱好者学习。前端开发者指南作者科迪林黎,由前端大师倾情赞助。翻译最佳实践译者张捷沪江前端开发工程师当你问起有关与时,老司机们首先就会告诉你其实是个没有网络请求功能的库。 前端基础面试题(JS部分) 前端基础面试题(JS部分) 学习 React.js 比你想象的要简单 原文地址:Learning React.js is easier than you think 原文作...

    fuyi501 评论0 收藏0
  • 你需要前端进阶书籍清单,分享下载

    摘要:写在前面目前专注深入学习,特花了点时间整理了一些前端学习相关的书籍。大致分为以下大系列系列系列基础系列应用系列进阶系列类库系列框架系列。这些书籍在这里免费提供下载,有兴趣的一起学习。 写在前面 目前专注深入JavaScript学习,特花了点时间整理了一些前端学习相关的书籍。 大致分为以下7大系列:CSS系列、DOM系列、JavaScript基础系列、JavaScript应用系列、Ja...

    yuanzhanghu 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<