DIV CSS 佈局教程網

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高級方法描述與應用全部內容了，希望大家多多支持~