๋ชจ๋ ํฌ์คํ
์ ์ธํ๋ฐ [์ํ์ฝ๋ฉ] ์๋ฐ์คํฌ๋ฆฝํธ ๊ฐ์์ ๋ด์ฉ์ ๋ด๊ณ ์์ผ๋ฉฐ
์ถ์ฒ๋ ์๋์ ์ฃผ์๋ก "egoing Lee"๋์ ์๋ฃ์
๋๋ค.
์์
์ ์ธ ์๋๊ฐ ์๋ ๊ณต๋ถํ ๊ฒ์ ์ ๋ฆฌํด๋๋ ๋ชฉ์ ์ผ๋ก ํฌ์คํ
ํ ๊ฒ์
๋๋ค.
www.inflearn.com/course/javascript-%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EA%B0%95%EC%A2%8C#
์น๋ธ๋ผ์ฐ์ Javascript (์๋ฐ์คํฌ๋ฆฝํธ) - ์ธํ๋ฐ
์ํ์ฝ๋ฉ ์๋ฐ์คํฌ๋ฆฝํธ ๊ฐ์ข ์
๋๋ค. ์น๋ธ๋ผ์ฐ์ ๋ฅผ ์ง์ ์ ์ดํ ์ ์๋ ์๋ฐ์คํฌ๋ฆฝํธ ๋ ํผ๋ฐ์ค๋ฅผ ๊ณต๋ถํด ๋ด
๋๋ค. ์ด๊ธ ์น ๊ฐ๋ฐ ํ๋ก๊ทธ๋๋ฐ ์ธ์ด JavaScript ์จ๋ผ์ธ ๊ฐ์ ์๋ฐ์คํฌ๋ฆฝํธ ๊ฐ์ข
www.inflearn.com
์ด๋ฒ ํฌ์คํ
์ jQuery๋ฅผ ์ด์ฉํด์ ๊ฐ์ฒด๋ฅผ ์กฐํํ๋ ๋ฐฉ๋ฒ์ ๋ํด์ ์ค๋ช
ํฉ๋๋ค.
์ ์ด ๋์์ ์ฐพ๊ธฐ (jQuery)
jQuery๋ฅผ ์ด์ฉํ๋ฉด DOM์ ์ฌ์ฉํ๋ ๊ฒ ๋ณด๋ค ํจ์ฌ ํจ์จ์ ์ผ๋ก ํ์ํ ๊ฐ์ฒด๋ฅผ ์กฐํํ ์ ์๋ค.
jQuery๋ ๊ฐ์ฒด๋ฅผ ์กฐํํ ๋ CSS ์ ํ์๋ฅผ ์ด์ฉํ๋ค.
jQuery์ ๊ธฐ๋ณธ๋ฌธ๋ฒ
jQuery์ ๊ธฐ๋ณธ ๋ฌธ๋ฒ์ ๋จ์ํ๊ณ ๊ฐ๋ ฅํ๋ค.
$()๋ jQuery์ ํจ์์ด๋ค.
ํจ์์ ์ธ์๋ก ์ฌ๋ฌ๊ฐ์ง๊ฐ ๋ค์ด์ฌ ์ ์์ง๋ง ๊ทธ ์ค CSS ์ ํ์(li)๋ฅผ ์ ๋ฌํ๋ฉด jQuery ๊ฐ์ฒด๋ผ๋ ๊ฒ์ ๋ฆฌํดํ๋ค.
๊ทธ ๋ค์ . ์ ์ด ํจ์๊ฐ ๋ฆฌํดํ ๊ฐ์ด ๊ฐ์ฒด๋ผ๋ ๊ฒ์ ์๋ฏธํ๋ค.
์ด ๊ฐ์ฒด๋ ์ ํ์์ ํด๋นํ๋ ์๋ฆฌ๋จผํธ๋ฅผ ์ ์ดํ๋ ๋ค์ํ ๋ฉ์๋๋ฅผ ๊ฐ์ง๊ณ ์๋ค.
์์ ๊ทธ๋ฆผ์์ css๋ ์ ํ์์ ํด๋นํ๋ ๊ฐ์ฒด๋ค์ style์ color:red๋ก ๋ณ๊ฒฝํ๋ค.
<li style = "color : red" >
์๋๋ DOM์ ์ด์ฉํ์ ๋์ jQuery๋ฅผ ์ด์ฉํ์ ๋๋ฅผ ๋น๊ตํ ๊ฒ์ด๋ค.
์๋ ์ฝ๋๋ ๋ณต์กํ๋, ์คํ๊ฒฐ๊ณผ๋ง ํ์ธํ์.
๋์์ ์ํค๋ฉด ์๋์ ๊ฐ์ด ๋ธ๋ผ์ฐ์ ์ ๋ํ๋๋ค.
์ถ๋ ฅ๋ ๊ฒ์ค ํ๋์์ผ๋ก ํ์๋ ๋ถ๋ถ์ DOM์ผ๋ก ์ฝ๋๋ฅผ ์ง ๊ฒฝ์ฐ์ด๊ณ , ๋นจ๊ฐ์ ์ผ๋ก ํ์ํ ๊ฒ์ jQuery๋ฅผ ์ด์ฉํ์ฌ ์ฝ๋ฉํ ๊ฒ์ด๋ค.
๊ฐ์ ์ญํ ์ ํ๋ ์ฝ๋์ด์ง๋ง, ํ ๋์ ๋ด๋ jQuery๊ฐ ํจ์ฌ ๊ฐ๊ฒฐํ๋ค๋ ๊ฒ์ด ๋๊ปด์ง ๊ฒ์ด๋ค.
๋งจ๋ง์ง๋ง ๋นจ๊ฐ์ ๋ค๋ชจ๋ฅผ ์ดํด๋ณด๋ฉด ๋ง์น ์ฒด์ธ์ฒ๋ผ ์ฐ๊ฒฐ์ด ๋์ด์๋ค.
์ ํํ ์๋ฆฌ๋จผํธ๋ค์ ์ฐ์์ ์ผ๋ก ๋ฉ์๋๋ฅผ ํธ์ถํ์ฌ ์ด๋ ํ ์์
์ ํ๋ ๊ฒ, ์ด๋ฌํ ๊ฒ์ 'chaining'์ด๋ผ๊ณ ํ๋ค.