[jQuery] 제이쿼리 적용 (파일 다운로드, CDN)
2021. 8. 6. 20:01
728x90
01 파일을 다운받아 로드하는 방법
- 웹사이트에서 최신 버전의 제이쿼리 파일을 다운.
<head>
<script src="/파일경로/제이쿼리파일명.js"></script>
</head>
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<title>jQuery setting with file</title>
<meta name='viewport' content='width=device-width, initial-scale=1'>
<script src="/resource/lib/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
alert("제이쿼리 셋팅 완료");
});
</script>
</head>
<body>
</body>
</html>
02 CDN을 이용하여 로드하는 방법
- CDN (Content Delivery Network) 을 이용함.
- 이 방법은 특정 서버에 트래픽이 집중되지 않고 콘텐츠 전송 시간이 매우 빨라짐.
- 파일을 저장하지 않아도 제이쿼리를 사용할 수 있음.
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<title>PjQuery setting with CDNs</title>
<meta name='viewport' content='width=device-width, initial-scale=1'>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(function(){
alert("제이쿼리 셋팅 완료");
});
</script>
</head>
<body>
</body>
</html>728x90
'jQuery > Study' 카테고리의 다른 글
| [jQuery] 자손 요소의 탐색 (.children, .find) (0) | 2021.08.07 |
|---|---|
| [jQuery] 조상 요소의 탐색 (.parent, .parents, .parentsUntil, .closest) (0) | 2021.08.07 |
| [jQuery] 형제 요소의 탐색 (.next, .prev, .nextAll, .prevAll, .nextUntil, .prevUntil, .siblings) (0) | 2021.08.07 |
| [jQuery] CSS 선택자 (자식 선택자">", 하위 선택자" ") (0) | 2021.08.07 |
| [jQuery] CSS 선택자 (태그 선택자, ID 선택자, class 선택자) (0) | 2021.08.07 |
