๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ

JQuery ๊ธฐ๋ณธ ์„ ํƒ์ž

by Youcodein 2022. 8. 30.
728x90
๋ฐ˜์‘ํ˜•

JQuery ๊ธฐ๋ณธ์„ ํƒ์ž

JQuery๋Š” html ์š”์†Œ์™€ ๊ด€๋ จ๋œ ๊ธฐ๋Šฅ๊ตฌํ˜„์ด ๋งŽ์•„ ๊ทธ๋งŒํผ CSS์™€ ๋งค์šฐ ๋ฐ€์ ‘ํ•œ ๊ด€๊ณ„๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค.

๊ธฐ๋ณธ ์„ ํƒ์ž

์„ ํƒ์ž ์ข…๋ฅ˜ ์„ค๋ช…
ํƒœ๊ทธ ์„ ํƒ์ž $("p") p์š”์†Œ๋ฅผ ์„ค๋ช…ํ•ฉ๋‹ˆ๋‹ค.
id ์„ ํƒ์ž $("#gnb") #gnb ์š”์†Œ๋ฅผ ์„ ํƒํ•ฉ๋‹ˆ๋‹ค.
class ์„ ํƒ์ž $(".logo") .logo์ธ ์š”์†Œ๋ฅผ ์„ ํƒํ•ฉ๋‹ˆ๋‹ค.
์ž์‹ ์„ ํƒ์ž $("#gnb > ul > li") #gnb์˜ ์ž์‹ ์š”์†Œ์˜ ์ž์‹ ์š”์†Œ li๋ฅผ ์„ ํƒํ•ฉ๋‹ˆ๋‹ค.
ํ•˜์œ„ ์„ ํƒ์ž $("#gnb ul") #gnb์˜ ํ•˜์œ„์— ์žˆ๋Š” ๋ชจ๋“  ul ์š”์†Œ๋ฅผ ์„ ํƒํ•ฉ๋‹ˆ๋‹ค.
์ธ์ ‘ ์„ ํƒ์ž $("#visual + #content") #visual์˜ ๋‹ค์Œ์— ์˜ค๋Š” #content์š”์†Œ๋ฅผ ์„ ํƒํ•ฉ๋‹ˆ๋‹ค.
ํ˜•์ œ ์„ ํƒ์ž $("#visual ~ #footer") #visual์˜ ํ˜•์ œ ์š”์†Œ #footer๋ฅผ ์„ ํƒํ•ฉ๋‹ˆ๋‹ค.
์ข…์† ์„ ํƒ์ž $("div.util") #div ์š”์†Œ ์ค‘ class๊ฐ€ util์ธ ์š”์†Œ๋ฅผ ์„ ํƒํ•ฉ๋‹ˆ๋‹ค.
๊ทธ๋ฃน ์„ ํƒ์ž $(".left, .right, #banner") .left .right, #banner ์š”์†Œ๋“ค์„ ์„ ํƒํ•ฉ๋‹ˆ๋‹ค.
์ „์ฒด ์„ ํƒ์ž $("*") ๋ชจ๋“  ์š”์†Œ๋ฅผ ์„ ํƒํ•ฉ๋‹ˆ๋‹ค.
728x90
๋ฐ˜์‘ํ˜•

'์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ' ์นดํ…Œ๊ณ ๋ฆฌ์˜ ๋‹ค๋ฅธ ๊ธ€

JQuery ํ•„ํ„ฐ ์„ ํƒ์ž  (4) 2022.08.31
JQuery ์†์„ฑ์„ ํƒ์ž  (3) 2022.08.30
JQuery๋ž€?  (5) 2022.08.30
GSAP๋ž€?  (7) 2022.08.29
ํ•จ์ˆ˜ ์ดํ•ดํ•˜๊ธฐ 2  (5) 2022.08.22

๋Œ“๊ธ€