jQuery

자바스크립트 라이브러리 jQuery 학습

  • 라이브러리란 자주 사용하는 로직을 재사용할 수 있도록 고안된 소프트웨어 (자바스크립트 코어, DOM, BOM을 활용해 만든 일종의 도구)

  • jQuery는 DOM을 내부에 감추고 보다 쉽게 웹페이지를 조작할 수 있도록 돕는 도구

jQuery 사용방법

  1. jQuery를 사용하기 위해서는 jQuery를 HTML로 로드(CDN(Contents Delivery Network)으로 불러오기 https://developers.google.com/speed/libraries#jquery)

  2. 직접 파일 다운로드 받아서 경로 지정해서 사용하기

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title></title>
</head>
<body>
  <input type="button" value="changeColor" onclick="fn_colorChange()">
  <ul>
    <li>banana</li>
    <li>apple</li>
    <li>mango</li>
  </ul>
  <!--  cdn에서 제이쿼리 불러오기  -->
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script>
    // 버튼을 누르면 li 컬러가 red로 변하는 함수(한번 실행)
    function fn_colorChange() {  
      $('li').css('color', 'red');
    }
  </script>
</body>
</html>

Last updated

Was this helpful?