본문 바로가기
Programming/JavaScript

[JQuery] JQuery란 무엇인가?

by 도낙원 2018. 5. 2.
반응형


  JQuery


자바스크립트의 라이브러리 중 하나로 자바스크립트를 좀 더 쉽게 사용하기 위해 만들어졌습니다. 

그래서 코드가 직관적이고 짧고 단순합니다. 예를 한번 보겠습니다.


태그의 ID 속성을 이요해 호출할 경우 

javascript - document.getElementById("id")

JQuery - $("#id")


코드가 많이 줄었다는 것을 한번에 알아볼수 있습니다.


  JQuery 사용방법


자바스크립트 라이브러리이기 때문에 라이브러리를 추가해줘야 사용이 가능합니다.


라이브러리 다운로드 




다운이 완료가 되면 js파일을 사용하기 위해 해당 프로젝트에 넣어야 합니다.



저는 프로젝트에서 assets/js 폴더를 만들어 그 곳에 넣어줬습니다.

라이브러리를 사용하려면 이제 연결을 해줘야 합니다.



위에 구문을 입력해주시면 간단하게 연결완료가 되고 이제 JQuery를 사용할 수 있습니다.


  JQuery 작성 위치


사실 자바스크립트를 <head>태그 안에 작성을 했습니다. 그래서 JQuery 도 그냥 생각없이 

<head>태그 안에 작성을 했습니다.

하지만 많은 사람들은 <body>태그 사이에 작성하는 것을 추천해주고 있습니다.

그 이유는 이러한 추가 위치에 따라 브라우저 렌더링이나 스크립트 실행 순서에 영향을 미치기 때문입니다. 가볍고 문서 초기화와 같은 내용은 <head>태그에 사용해도 무방하지만 그렇지 않다면 브라우저 렌더링이 완료된 뒤에 스크립트가 실행되게끔 하는 것이 페이지 노출에 아무런 영향을 미치지 않습니다. 그래서 <body>태그안에 사용하는 것입니다.



이제 JQuery를 사용할 준비가 완료되었습니다. 다음 시간에는 JQuery를 사용해보도록 하겠습니다.

반응형
사업자 정보 표시
난길샵 | 박현숙 | 경상북도 성주군 월항면 수죽길 98길 | 사업자 등록번호 : 256-07-01668 | TEL : 010-9909-8420 | Mail : skr04@naver.com | 통신판매신고번호 : 제2020-경북성주-52호 | 사이버몰의 이용약관 바로가기

'Programming > JavaScript' 카테고리의 다른 글

J-Query(두 번째 - 객체 확장)  (0) 2017.02.16
J-Query(두 번째 - 배열)  (0) 2017.02.16

댓글