浅谈jquery高级方法描述与应用


Posted in Javascript onOctober 04, 2016

1.addBack()

a. third-item的 li 下几个相邻节点(包括third-item)

$( "li.third-item" ).nextAll().addBack(). 
 .css( "background-color", "red" );

b. 和end()方法类似,选中的是div.after-addback和p元素,end选中的是div.after-addback元素

$( "div.after-addback").find("p").addBack().addClass("background"); 
$( "div.after-addback").find("p").end().addClass("background");

2.callback.fire()

通过参数调用foo函数

var foo = function(value){ 
  console.log( "foo:" + value ); 
} 
var callbacks = $.Callbacks(); 
callbacks.add(foo); 
callbacks.fire("hello"); 
callbacks.fire("world");

3.callback.lock()

锁住callback函数列表,这个方法不能接受任何参数。

var foo = function( value ) { 
 console.log( "foo:" + value ); 
}; 
var bar = function( value ){ 
 console.log( "bar:" + value ); 
}  
var callbacks = $.Callbacks(); 
callbacks.add( foo ); 
callbacks.fire( "hello" ); // 输出 "foo: hello" 
callbacks.lock(); // 此后不能在调用foo方法,除非$.Callbacks("memory") ,可以add一个函数 
callbacks.fire( "world" ); // 没有调用foo方法 
callbacks.add( bar ); // 当callbacks 赋值为 $.Callbacks("memory") ,创建一个callback对象,使用memory标识,可以再add一个函数 
callbacks.fire( "world" ); // 输出 "bar: hello"

4.defered.promise()

在原来的Deferred对象上返回另一个Deferred对象

$(function(){ 
  $("input[type=button]").click(function(){ 
    $.ajax({ 
      url : "validate.html", 
      type : "POST", 
      dataType : "json" 
    }).done(function(data){ 
      alert(data.a); 
    }).fail(function(){ 
      alert("error"); 
    }) 
  }); 
       
  var dtd = $.Deferred(); 
  var wait = function(dtd){ 
    var tasks = function(){ 
      alert("执行完毕!"); 
      dtd.resolve(); // 改变Deferred对象的执行状态 
    }; 

  setTimeout(tasks,5000); 

 }; 

 dtd.promise(wait); 

 wait.done(function(){ alert("哈哈,成功了!"); }).fail(function(){ alert("出错啦!");  
});

5.animate({ step : function(){ } })

一个元素动画的同时进行另一个元素的动画

$( "#go" ).click(function() { 
 $( ".block:first" ).animate({ 
  left: 100 
 }, { 
  duration: 1000, 
  step: function( now, fx ){ 
   $( ".block:gt(0)" ).css( "left", now ); 
  } 
 }); 
});

6.clone()

与appendTo方法同时使用,创建一个克隆的元素

<div class="container"> 
 <div class="hello">Hello</div> 
 <div class="goodbye">Goodbye</div> 
</div>
$( ".hello" ).appendTo( ".goodbye" );

结果是:

<div class="container"> 
 <div class="goodbye"> 
  Goodbye 
  <div class="hello">Hello</div> 
 </div> 
</div>
$( ".hello" ).clone().appendTo( ".goodbye" );

结果是:

<div class="container"> 
 <div class="hello">Hello</div> 
 <div class="goodbye"> 
  Goodbye 
  <div class="hello">Hello</div> 
 </div> 
</div>

以上就是小编为大家带来的浅谈jquery高级方法描述与应用全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
Json对象替换字符串占位符实现代码
Nov 17 Javascript
Jquery实现图片左右自动滚动示例
Sep 25 Javascript
js取得html iframe中的元素和变量值
Jun 30 Javascript
Node.js文件操作详解
Aug 16 Javascript
JavaScript控制listbox列表框的项目上下移动的方法
Mar 18 Javascript
javascript实现实时输出当前的时间
Apr 27 Javascript
JS实现仿微博可关闭弹出层效果
Sep 21 Javascript
JavaScript面向对象编写购物车功能
Aug 19 Javascript
深入理解Javascript中的valueOf与toString
Jan 04 Javascript
vue如何实现动态加载脚本
Feb 05 Javascript
jQuery弹框插件使用方法详解
May 26 jQuery
JS前端使用Canvas快速实现手势解锁特效
Sep 23 Javascript
vue.js中$watch的用法示例
Oct 04 #Javascript
Angularjs实现带查找筛选功能的select下拉框示例代码
Oct 04 #Javascript
用jquery快速解决IE输入框不能输入的问题
Oct 04 #Javascript
JavaScript九九乘法口诀表的简单实现
Oct 04 #Javascript
原生js仿jquery实现对Ajax的封装
Oct 04 #Javascript
json定义及jquery操作json的方法
Oct 03 #Javascript
javascript中异常处理案例(推荐)
Oct 03 #Javascript
You might like
php 中文和编码判断代码
2010/05/16 PHP
php禁用函数设置及查看方法详解
2016/07/25 PHP
Linux下 php7安装redis的方法
2018/11/01 PHP
javascript iframe中打开文件,并检测iframe存在否
2008/12/28 Javascript
jQuery Migrate 1.1.0 Released 注意事项
2014/06/14 Javascript
判断在css加载完毕后执行后续代码示例
2014/09/03 Javascript
JavaScript学习笔记之Function对象
2015/01/22 Javascript
jquery实现页面关键词高亮显示的方法
2015/03/12 Javascript
BootStrap创建响应式导航条实例代码
2016/05/31 Javascript
javascript闭包概念简单解析(推荐)
2016/06/03 Javascript
Js+Ajax,Get和Post在使用上的区别小结
2016/06/08 Javascript
JS用斜率判断鼠标进入DIV四个方向的方法
2016/11/07 Javascript
jquery easyui validatebox remote的使用详解
2016/11/09 Javascript
js实现小窗口拖拽效果
2016/12/03 Javascript
vue.js指令v-model实现方法
2016/12/05 Javascript
vue语法之拼接字符串的示例代码
2017/10/25 Javascript
element-ui 中使用upload多文件上传只请求一次接口
2019/07/19 Javascript
mock.js模拟前后台交互
2019/07/25 Javascript
vue 里面的 $forceUpdate() 强制实例重新渲染操作
2020/09/21 Javascript
[07:59]2014DOTA2叨叨刀塔 林熊猫称被邀请赛现场盛况震撼
2014/07/21 DOTA
python PIL模块与随机生成中文验证码
2016/02/27 Python
利用python计算windows全盘文件md5值的脚本
2019/07/27 Python
深入浅析Python 命令行模块 Click
2020/03/11 Python
python 根据列表批量下载网易云音乐的免费音乐
2020/12/03 Python
浅谈HTML5新增及移除的元素
2016/06/27 HTML / CSS
localStorage的过期时间设置的方法详解
2018/11/26 HTML / CSS
北京-环亚运商测试题.net程序员初步测试题
2013/05/28 面试题
出生医学证明样本
2014/01/17 职场文书
汽车维修工岗位职责
2014/02/12 职场文书
幼儿园庆六一活动方案
2014/03/06 职场文书
学雷锋树新风演讲稿
2014/05/10 职场文书
物业管理工作方案
2014/05/10 职场文书
升职感谢信
2015/01/22 职场文书
锦旗赠语
2015/06/23 职场文书
有关西游记的读书笔记
2015/06/25 职场文书
会计工作自我鉴定范文
2019/06/21 职场文书