WEB/2020_webCamp

jQuery Tutorial

HBean_ 2020. 7. 31. 02:25

 

jQuery 

  • javascript의 library
  • javascript 보다 더 간단, 직관, 편리
  • jquery 를 다운 받아야 사용가능하다.
    • <head><script src=“jquery-3.5.1.min.js”></script></head>

 

  • jQuery syntax : $(selector).action()
    • $ : define or access jQuery
    • selector
      • this : the current element
      • “p” : tag의 경우 기호 없이 그대로 적음
      • “.class” : class의 경우 . 붙임
      • “#id” : id의 경우 #붙임

 

  • jQuery Event
    • click() : 마우스 왼쪽 버튼을 눌렀을 때 
    • dbclick() : 더블 클릭 했을 때
    • mouseenter() : element위로 마우스 커서가 올라왔을 때
    • mouseleave() : element 위에서 밖으로 마우스 커서가 나갔을 때
    • mousedown() : 마우스의 어떤 버튼이든 눌렀을 때
    • mouseup() : 마우스의 어떤 버튼이든 눌렸다가 풀렸을 때
    • hover() : mouseenter() + mouseleave()
    • focus() : form field가 눌렀을 때
    • blur() : form field가 눌렀다가 풀렸을 때 
    • on() : 하나 이상의 event를 붙일 때

 

 

 

 

 

 

 

https://www.w3schools.com/jquery/default.asp

 

jQuery Tutorial

jQuery Tutorial Examples in Each Chapter With our online editor, you can edit the code, and click on a button to view the result. Example $(document).ready(function(){   $("p").click(function(){     $(this).hide();   }); }); Try it Yourself » Click

www.w3schools.com