Bind.. Live.. Delegate..on..

In this lesson we repeat some important topics about event handlers. These all are very simple and interesting methods.

Bind : Alternate method of On keyword.

$('h1').bind( 'click', function () {
console.log( 'clicked' );
});

Clone : This is use for cloning.

$('h1').bind( 'click', function(){
console.log( 'clicked');
var clone = $(this).clone();
console.log(clone);
});

appendTo

$('h1').bind( 'click', function(){
console.log( 'clicked');
var clone = $(this).clone().appendTo('body');
console.log(clone);
});

By using clone and appendTo method togeather when we click on any h1 element it make a clone or same as h1 element who sharing same properties. Every time when we click on original h1 element it make new clone. There all properties are same of clone as h1 element but when we click on clone element in not able to make new h1 clone element. We can also that just passing true value into clone method. When we do this than cone element perform like original h1 element. let see

$('h1').bind( 'click', function(){
console.log( 'clicked');
var clone = $(this).clone(true).appendTo('body');
console.log(clone);
});

When we pass true value than the clone element perform like original h1 element but when we pass a false value into clone than it perform only like clone element.

Live : This method is use for give effect on all document not on particular element.

If we use live method into above examples than we no need to passing any true value into clone method because it's giving effect to complete document not on any particular selecting item.

$('h1').Live( 'click', function(){
console.log( 'clicked');
$(this).clone().appendTo('body');
});

Increase performance of code :

By selecting element from this style we can increase performance of our code.

Delegate :

We can also use here Undelegate method.