웹퍼블

    jQuery - 이벤트 정리

    마우스 이벤트(MOUSE EVENTS) 1.click(); - 마우스 클릭할 때 실행 $("button").click(function(){ //클릭할 때 실행할 때 명령 입력!! }); 2.dblclick(); - 마우스 더블 클릭할 때 실행 $("button").dblclick(function(){ //더블클릭할 때 실행할 명령 입력!! }) 3.mouseenter(); - 마우스가 요소 위에 올려질 때 실행 $("button").mouseenter(function(){ //마우스가 요소에 올려질 때 실행할 명령 입력!! }); 4.mouseleave(); - 마우스가 요소 위에서 나갈 때 실행 $("button").mouseleave(function(){ //마우스가 요소에 날갈 때 실행할 명령 입력..

    jQuery - 스타일, 속성, 동작 관련

    1.CSS 속성 수정 아이디가 box인 요소의 배격색을 red로 바꾼다. $('#box').css({'background-color':'red'}); $('#box').css('background-color','red'); $('#box').css({backgroundColor:'red'}); 위의 3가지 코드는 작성 방법만 다를 뿐 결과가 같다. 2.제이쿼리로 여러가지 CSS속성 수정 $('#box').css({'background-color':'red','color':'white'}); $('#box').css({backgroundColor:'red',color:'white'}); 두가지 이상의 CSS속성을 변경할 때 콤마(,)로 구분해서 작성한다. 3.클래스 추가 $('#box').addClass(..

    jQuery - 선택자

    1.요소 선택자 $("요소") - html의 요소를 선택합니다. $("div").text("선택"); 2.아이디선택자 $("#id") - 아이디로 html의 요소를 선택합니다. $("#box").text("선택"); 3.클레스선택자 $(".class") - html의 클레스요소를 선택합니다. $(".box").text("선택"); 4.모든 선택자 $("*") - 모든 요소를 선택합니다. $("*").text("선택"); 5.자식 선택자 $("ul > li") - ul 밑에 li 요소를 선택합니다. $("ul > li").text("선택"); 5.자손선택자 선택자 $("#box div") - #box 밑에 모든 div를 선택합니다. $("#box div").text("선택"); 6.형제 선택자(1) $("..