๐ปjQuery ๋
- ์๋ฐ์คํฌ๋ฆฝํธ ์ฝ๋๋ฅผ ๊ฐ๊ฒฐํ๊ฒ ์์ฑํ๊ณ , ํฌ๋ก์ค ๋ธ๋ผ์ฐ์ง ๋ฌธ์ ๋ฅผ ํด๊ฒฐํ๋ฉฐ, ๋ค์ํ ๊ธฐ๋ฅ์ ์ฝ๊ฒ ์ฌ์ฉํ ์ ์๊ฒ ํด์ฃผ๋ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ด๋ค.
- ์๋ฐ์ .jar ํ์ผ ์ฌ๋ฌ๊ฐ ๋ชจ์๋์ ๊ฒ์ด๋ผ ์๊ฐํ๋ฉด๋๋ค.
- jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility, jQuery has changed the way that millions of people write JavaScript.
- ๋น ๋ฅด๊ณ ์๊ณ ,HTML ํ์, ์กฐ์, ์ด๋ฒคํธ ํธ๋ค๋ง, ์ ๋๋ฉ์ด์ ๋ฑ์ ๋ค๋ฃฌ๋ค.
ํน์ง
1. ๊ฐ๋ณ๋ค.
2. ์ด์ ๋ ์๋ฐ์คํฌ๋ฆฝํธ์ selector ๊ธฐ๋ฅ์ด
3. ๊ฐ ๋ธ๋ผ์ฐ์ ํ์ฌ๋ค์ด html, css ๋ฑ์ ๋ค๋ฅด๊ฒ ์ ๊ณตํ๋ค. ํ๋์ ์ฝ๋๊ฐ ์ด๋ค ๋ธ๋ผ์ฐ์ ์์๋ ์๋์ด ์ ๋๋ ๋ฐ๋ฉด, ์๋๋ ๋ธ๋ผ์ฐ์ ๋ ์กด์ฌํ๋ค. ์ ์ํ ๋ธ๋ผ์ฐ์ ์ ๋ฐ๋ผ ์ฌ์ฉ๊ฐ๋ฅํ ๊ธฐ๋ฅ์ผ๋ก ์ ํ์ ํด์ค๋ค.
์์ฆ์ ์น ๋ฐ์ ์ผ๋ก ์ ์ด์ฟผ๋ฆฌ๋ฅผ ์ฌ์ฉํ์ง์์๋ ์ ๊ธฐ๋ฅ์ ์ฌ์ฉํ ์ ์๊ฒ ๋์๋ค.
๐ป์ค์น
1. ๋ก์ปฌ ์ค์น
ํ์ผ ๋ค์ด๋ก๋ ํ ์ฐธ์กฐํ๋ค.
์ฌ์ดํธ ์ ์
jQuery
What is jQuery? jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers.
jquery.com
Download jQuery ํด๋ฆญ
๋ค์ด ๋ฐ์ ๋ฒ์ ์ ํ
๋ฒ์ ์ ์ฐจ์ด๋ ๊ธฐ๋ฅ์ ํฐ ์ฐจ์ด๊ฐ ์๊ณ ๋ธ๋ผ์ฐ์ ํธํ์ด ๋ค๋ฅด๋ค.
1์ ๋ ๋ฒ์ ๋ชจ๋ ๋ธ๋ผ์ฐ์ ํธํ์ด ๊ฐ๋ฅํ๋ค
3์ ๋ ์ต์ ๋ธ๋ผ์ฐ์ ์์ฃผ๋ก ํธํ์ด ๊ฐ๋ฅํ๋ค (๊ตฌ ๋ธ๋ผ์ฐ์ ๋ ์๋์ด ์๋๋ค)
์ฌ์ ํ 1์ ๋ ๋ฒ์ ์ ๊ฐ์ฅ ๋ง์ด ์ฌ์ฉํ๋ค.
๊ตฌ๋ฒ์ ๋ค์ด๋ก๋
ํ์ด์ง ๋งจ ๋ฐ์ผ๋ก ๋ด๋ฆฌ๋ฉด 'Past Releases' ์ 'jQuery CDN' ํด๋ฆญ
jQuery CDN
์๋ ๋งํฌ๋ก ์ ์ ๊ฐ๋ฅํ๋ค.
jQuery CDN
jQuery CDN – Latest Stable Versions jQuery Core Showing the latest stable release in each major branch. See all versions of jQuery Core. jQuery 3.x jQuery 2.x jQuery 1.x jQuery Migrate jQuery UI Showing the latest stable release for the current and legac
releases.jquery.com
uncompressed์ ๋น์์ถ ๋ฒ์ ํ์ผ, minified์ ์์ถ ๋ฒ์ ํ์ผ์ด๋ค.
๋น์์ถ ๋ฒ์ ์ ๊ฐ๋ฐํ ๋ ์ฌ์ฉํ๊ณ , ์์ถ ๋ฒ์ ์ ์คํ์ ํ์ํ ์ฝ๋ ์ ์ธํ๊ณ ์คํ์ด๋ฐ, ์ํฐ๋ฅผ ์ญ์ ํ ์ฝ๋๋ก ์๋น์ค ์ด์ํ ๋ ์ฌ์ฉํ๋ค.
ํ์ต์ฉ์ผ๋ก ๋น์์ถ ๋ฒ์ ์ ๋ค์ด๋ก๋ํ๋ค.
ํด๋น ํ์ผ ์ฐํด๋ฆญํ์ฌ ๋ค๋ฅธ ์ด๋ฆ์ผ๋ก ๋งํฌ ์ ์ฅํ๋ค.
์๋ ๋งํฌ๋ก ์ ์ฅ
C:\class\code\client\ClientTest\src\main\webapp\asset\js
์ฝ๋ ์ฐธ์กฐ
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script src="../asset/js/jquery-1.12.4.js"></script>
</body>
</html>๋ฐ๋ ํ๊ทธ์ <script src="../asset/js/jquery-1.12.4.js"></script>๋ฅผ ์ถ๊ฐํ๋ค.
2. CDN ์ค์น
์๊ฒฉ ํ์ผ์ ์ฐธ์กฐํ๋ ๋ฐฉ๋ฒ์ผ๋ก ์ธํฐ๋ท ์ ์ ๋น์ฉ์ ์ค์ผ ์ ์๋ค.
๋ก์ปฌ์ ์ค์นํ๋ฉด ์ ์์๋ง๋ค ๋ค์ด๋ก๋๋ฅผ ํด์ผํ๋ฏ๋ก ๋น์ฉ์ด ์ปค๋๋ฐ CDN์ผ๋ก ์ค์นํ๋ฉด ์ฐ๋ฆฌ ์๋ฒ์์ ๋ค์ด๋ก๋ ํ๋ ๊ฒ์ด ์๋๋ผ ์ ์ ๋น์ฉ์ ๋ฎ์ถ ์ ์๋ค.
๋จ, CDN ์๋ฒ๊ฐ ๋ซํ๋ฉด ์ฐ๋ฆฌ ์ฌ์ดํธ๋ ์ด์ฉํ์ง ๋ชปํ๋ค.
์ฌ์ดํธ ์ ์
jQuery CDN
jQuery CDN – Latest Stable Versions jQuery Core Showing the latest stable release in each major branch. See all versions of jQuery Core. jQuery 3.x jQuery 2.x jQuery 1.x jQuery Migrate jQuery UI Showing the latest stable release for the current and legac
releases.jquery.com
1.x ๋ฒ์ ์ ๋น์์ถ๋ฒ์ ํด๋ฆญ
script ๋ณต์ฌ
์ฝ๋ ์ฐธ์กฐ
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
</body>
</html>body ํ๊ทธ์ ๋ณต์ฌํ ์ฝ๋๋ฅผ ๋ฃ๊ณ integrity, crossorigin๋ ์ง์์ค๋ค.
'WEB > jQuery' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
| [jQuery] ์คํฌ๋กค ์ด๋ฒคํธ : ํ๋ก์ธ์ค ๋ฐ ๋ง๋ค๊ธฐ (0) | 2023.10.16 |
|---|---|
| jQuery๋ก CSS ์กฐ์ (0) | 2023.10.16 |
| [jQuery] jQuery ์ด๋ฒคํธ ํจ์ (0) | 2023.10.13 |
| [jQuery] jQuery ํจ์ (0) | 2023.10.13 |
