Jquery advanced method description and Application

1. addBack ()

A. Several adjacent nodes (including third-item) under the li of third-item)

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

B. Similar to the end () method, the selected div. after-addback and p elements are selected, and the end element is the div. after-addback element.

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

2. callback. fire ()

Call the foo function using parameters

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

3. callback. lock ()

Lock the callback function list. This method does not accept any parameters.

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"); // output "foo: hello" callbacks. lock (); // you cannot call the foo method later unless $. callbacks ("memory"), you can add a callbacks function. fire ("world"); // The foo method callbacks is not called. add (bar); // when callbacks is assigned $. callbacks ("memory"), creates a callback object and uses the memory identifier. You can add another callbacks function. fire ("world"); // output "bar: hello"

4. defered. promise ()

Return another Deferred object on the original Deferred object

$ (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 ("execution completed! "); Dtd. resolve (); // change the execution status of the Deferred object}; setTimeout (tasks, 5000);}; dtd. promise (wait); wait. done (function () {alert ("Haha, success! ") ;}). Fail (function () {alert (" error! ");});

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

Animation of one element at the same time

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

6. clone ()

Used together with the appendTo method to create a cloned Element

  Hello  Goodbye

$( ".hello" ).appendTo( ".goodbye" );

The result is:

      Goodbye    Hello  

$( ".hello" ).clone().appendTo( ".goodbye" );

The result is:

  Hello      Goodbye    Hello