JQuery(1)

woococoยท2022๋…„ 6์›” 5์ผ
1

web

๋ชฉ๋ก ๋ณด๊ธฐ
8/12

๐Ÿ–Š ์šฉ์–ด์ •๋ฆฌ

1. JQuery

์ œ์ด์ฟผ๋ฆฌ๋Š” ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์–ธ์–ด๋ฅผ ๊ฐ„ํŽธํ•˜๊ฒŒ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ๋‹จ์ˆœํ™”์‹œํ‚จ ์˜คํ”ˆ ์†Œ์Šค ๊ธฐ๋ฐ˜์˜ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋กœ ์ œ์ด์ฟผ๋ฆฌ๋ฅผ ์ด์šฉํ•˜๋ฉด ๋ฌธ์„œ ๊ฐ์ฒด ๋ชจ๋ธ(DOM)๊ณผ ์ด๋ฒคํŠธ์— ๊ด€ํ•œ ์ฒ˜๋ฆฌ๋ฅผ ์†์‰ฝ๊ฒŒ ๊ตฌํ˜„ํ•  ์ˆ˜ ์žˆ๋‹ค.
๋˜ํ•œ, Ajax ์‘์šฉ ํ”„๋กœ๊ทธ๋žจ ๋ฐ ํ”Œ๋Ÿฌ๊ทธ์ธ๋„ ์ œ์ด์ฟผ๋ฆฌ๋ฅผ ํ™œ์šฉํ•˜์—ฌ ๋น ๋ฅด๊ฒŒ ๊ฐœ๋ฐœํ•  ์ˆ˜ ์žˆ๋‹ค.

2. ajax

๋น„๋™๊ธฐ์ ์ธ ์›นํŽ˜์ด์ง€ ์ œ์ž‘์„ ์œ„ํ•œ ๊ธฐ๋ฒ•

3. json

Javascript Object Nation
ํ‚ค-๊ฐ’ ์Œ์œผ๋กœ ์ด๋ฃจ์–ด์ง„ ๋ฐ์ดํ„ฐ ์˜คํ”„์ ํŠธ, ๋งˆํฌ์—… ์–ธ์–ด ํ˜น์€ ๊ฐœ๋ฐฉํ˜• ํ‘œ์ค€ํฌ๋งท
์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ ํŒŒ์ƒ๋˜์—ˆ์ง€๋งŒ ๋‹ค ์‚ฌ์šฉํ•จ

4. CDN

Contents Delivery Network
์ž๋ฃŒ๋ฅผ ํšจ์œจ์ ์œผ๋กœ ์ „๋‹ฌํ•˜๊ธฐ ์œ„ํ•ด ์—ฌ๋Ÿฌ ๋…ธ๋“œ๋ฅผ ๊ฐ€์ง„ ๋„คํŠธ์›Œํฌ์— ๋ฐ์ดํ„ฐ๋ฅผ ์ €์žฅํ•˜์—ฌ ์ œ๊ณตํ•˜๋Š” ์‹œ์Šคํ…œ
(๋ฐ์ดํ„ฐ๋ฅผ ์ €์žฅํ•ด๋‘” ๋ณต์ œ๋ณธ์„ ์—ฌ๋Ÿฌ๊ฐœ ๋‘ )

5. onload

<script src="CDN์›น์ฃผ์†Œ"></script>
<script>
 $(function() {
 alert(โ€˜load!!โ€™);
 });
</script>

6. onclick

<script>
$(โ€œ#id_nameโ€).on(โ€œclickโ€,function(){
console.log(โ€˜click!โ€™);
});
</script>

7. onmouseover

<script>
$(โ€œ#id_nameโ€).on(โ€œmouseenterโ€,function(){
console.log(โ€˜click!โ€™);
});
</script>

๐Ÿ–Š ์˜ˆ์‹œ

1. text ์ž…๋ ฅํ•˜๊ณ  ์ƒ‰ ๋ณ€๊ฒฝํ•˜๊ธฐ

2. facebook timeline

3. ๋งˆ์šฐ์Šค๋กœ ํด๋ฆญํ–ˆ์„ ๋•Œ ์ƒ‰ ๋ณ€๊ฒฝ

profile
splunk

0๊ฐœ์˜ ๋Œ“๊ธ€