211006_on(동적/정적)

JQuery 2021. 10. 6. 17:22

//on: 1.8이전에는 live 사용

//처음부터 존재하는 요소나 미래에 생기게 될 요소에 모두 이벤트 가능

<!DOCTYPE html>

<html>

<head>

<title>Insert title here</title>

$(function () {

//jquery on("click")과 click() 차이

//동적으로 이벤트를 바인딩할 수 있는지의 차이

//click()은 최초에 선언된 element에만 동작 가능

//두번째 파라메타에선 지정자를 선택 가능..on("click",지정자,,function())

/* //정적이벤트

$("#mylang").children().click(function() {

$(this).remove();

});

//li태그 추가

//정적인 이벤트는 추가된후 삭제 안됨(최초에 선언한 엘리멘트만 동작가능)

$("#mylang").append('<li>JavaScript</li>'); */

//동적이벤트

//이벤트가 이어나갈 것에 대해 click 옆에 두기..'li'

$("#mylang").on("click", 'li', function() {

$(this).remove(); //$(event.target).remove())

});

$("#mylang").append('<li>JavaScript</li>');

});

</script>

</head>

<body>

<li>Oracle</li>

<li>Jquery</li>

</ul>

</body>

</html>

공부하자.. 공부하자..