jQuery事件附件

Posted 2021-02-24

다양한 형태로 jQuery를 이용하여 DOM 요소에 이벤트를 다는 방법

//The method attaching event listener.
//all method is based on 'on' method.
//여기에 나오는 모든 메소드들은 on 메소드에서 파생된 메소드임
//모든 태그에 이벤트를 다는 것보다, 상위태그에 이벤트를 달고 이벤트가 걸리는 시점에 작업을 하는 것이 보다 효율적임
(function(){
	$('h2').click(function(){
		console.log("clicked");
		$(this).clone(true).appendTo('body');		
	});
 
	$('h2').bind('click',function(){
		console.log("clicked");
		$(this).clone(true).appendTo('body');		
	});
 
	$('h2').on('click', function(){
		console.log("clicked");
		$(this).clone(true).appendTo('body');		
	});
 
	$('h2').live('click', function(){
		console.log("clicked");
		$(this).clone().appendTo('body');		
	});
	$('body').delegate('h2', 'click', function(){
		console.log("clicked");
		$(this).clone().appendTo('body');		
	});
	$('body').on('click', 'h2', function(){
		console.log("clicked");
		$(this).clone().appendTo('body');		
	});
})();