<다운로드 주의사항>
www.jquery.com 들어가서 다운로드 해주는데 일반 다운로드 하듯이 하면 안 됨
최상단에 있는 파일로 다운을 받아야 하는데
일반적인 상황에서는 클릭을 하지만..
클릭을 하면 안 된다.
마우스 오른쪽 클릭 후
다른 이름으로 링크 저장
<html에서 제이쿼리 라이브러리 파일 불러오기>
<head>
<script src="../jquery-3.6.0.min.js"></script>
</head>head 사이에 파일명만 붙여주고, 뒤에 js만 붙이면 된다. 같은 폴더에 있으면 "jquery-3.6.0.min.js"만 해줘도 되는데 전 폴더에 있어서 ../ 트리구조를 이용했음
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="../jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
$("#sample").hide();
});
</script>
</head>
<body>
<div id="sample">이 div를 지우고 싶다</div>
</body>
</html>
제이쿼리를 사용하기 위한 기본형 (문법)
<script>
$(document).ready(function(){
$("#sample").hide();
});
</script>① $(document).ready(function(){ });
<script>
$(function(){
$("#sample").hide();
});
</script>② $(function(){ });
body 영역에 모든 문서 객체들을 로딩한 후에 실행문을 실행하는 방법입니다. 둘 중에 하나만 해주면 되는데 빠지면 실행을 할 수 없습니다. 아무래도 1번 보다는 2번이 짧으니까 이걸 많이 사용하겠죠?
$(function(){
$("#sample").hide();
});
그렇다면 $(function(){ }); 안에서는 무슨 일이 벌어지고 있는 걸까?
$("#sample").hide();
마침표(.)를 기준으로 앞은 가져와, 뒤는 처리해 라는 뜻을 갖고 있다.
말 그대로 #sample -> id가 샘플인 것을 갖고와서
hide(); -> 숨겨라
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="../jquery-3.6.0.min.js"></script>
<script src="jq-12.js"></script>
</head>
html 파일에서 다른 jqurey 파일을 불러오고 싶다면?
<script src="../jquery-3.6.0.min.js"></script> 제이쿼리 위치를 먼저 불러오고, 내가 불러오고 싶은 제이쿼리 파일을 <script src="jq-12.js"></script> 이렇게 불러오면 된다.
'개발일지 > JavaScript + jquery' 카테고리의 다른 글
| [jquery] 기본 명령어 예제 몇 가지 ② (0) | 2021.09.13 |
|---|---|
| [jquery] 명령어 기본규칙과 예시들① (0) | 2021.09.10 |
| [js] canvas에 그림 그리기(선, 사각형, 삼각형, 글씨 등) (0) | 2021.09.10 |
| [js] 새 창 열기 & 연 창을 닫기 & 새 창에서 인쇄 (window 객체 사용) (0) | 2021.09.09 |
| [js] 타이머 setTimeout (0) | 2021.09.09 |
