[JQuery] 기본 태그

$(function (){ 

// 숨기기
$("p").hide(); 

// 첫번째 숨기기
$("ul li:first").hide();

// 마지막 숨기기
$("ul li:last").hide();

// nth-child
$("ul ul li:nth-child(2)").hide();
// 홀수
$("tr:nth-child(odd)").css("background-color","blue");
// 짝수
$("tr:nth-child(even)").css("background-color","blue");

// text 가져오기
alert($('#demo').text()); 
alert($('#demo').html());
 
// val 가져오기
alert($('#id').val()); 

// fade
$("#fadein").click(function (){ 
$("#div1").fadeIn();  
}); 
$("#fadeout").click(function (){ 
$("#div1").fadeOut(); 
}); 
$("#fadetoggle").click(function (){ 
$("#div1").fadeToggle(); 
});

// 마우스 오버
$(".cls1").mouseover(function(){ 
    $('#test').text("마우스 커서가 영역에 들어옴"); 
}); 

// 마우스 아웃
$(".cls1").mouseout(function(){ 
   $('#test').text("마우스 커서가 영역을 벗어남"); 
});

// 마우스 엔터
$("#test").mouseenter(function(){ 
alert("마우스엔터"); 
}); 

// 마우스 리브
$("#test").mouseleave(function(){ 
alert("마우스 떠나다"); 
});

// 마우스 클릭
$("#test").mousedown(function(){ 
alert("클릭"); 
}); 

// 마우스 놓음
$("#test").mouseup(function(){ 
alert("놓음"); 
});

// #btn클릭시 인풋(#id)에 입력한값 #demo 에 올리기 
$("#btn").click(function(){ 
 $('#demo').text($("#id").val()); 
}); 

// 클릭한 p태그의 text만 가져옴 
$("p").click(function () { 
 alert($(this).text()); 
});

// 더블클릭
$("p").dblclick(function(){ 
$(this).hide(); 
});

// focus + css
$("input").focus(function(){ 
     $(this).css("background-color","red"); 
});

// focusout or blur
$("input").focusout(function(){ 
     $(this).css("background-color","white"); 
});

// 토글
$("#toggleBtn").click(function(){ 
$('p').toggle(); 
});



});