Skip to content

jquery_in_depth_2

paul edited this page May 12, 2017 · 2 revisions

νš‘λ‹¨ νƒμƒ‰ν•˜κΈ°

νš‘λ‹¨ 탐색(Traversion) λ©”μ„œλ“œλŠ” 이미 μ„ νƒλœ μš”μ†Œλ₯Ό 기점으둜 μƒˆλ‘œμš΄ μš”μ†Œλ₯Ό μ°Ύμ•„ μ„ νƒν•˜λŠ” κΈ°λŠ₯을 μ œκ³΅ν•œλ‹€.

필터링 λ©”μ„œλ“œ

필터링 λ©”μ„œλ“œλŠ” 이미 μ„ νƒν•œ μš”μ†Œμ— 좔가적인 쑰건을 λΆ€μ—¬ν•΄ κ±ΈλŸ¬λ‚΄λŠ” λ©”μ„œλ“œμ΄λ‹€.

λ©”μ„œλ“œ μ„€λͺ…
first() κΈ°μ‘΄ μ„ νƒλœ μš”μ†Œ 쀑 첫번째 μš”μ†Œλ₯Ό μ„ νƒν•œλ‹€.
last() κΈ°μ‘΄ μ„ νƒλœ μš”μ†Œ 쀑 λ§ˆμ§€λ§‰ μš”μ†Œλ₯Ό μ„ νƒν•œλ‹€.
eq() κΈ°μ‘΄ μ„ νƒλœ μš”μ†Œ 쀑 νŠΉμ • 인덱슀 μœ„μΉ˜μ— μžˆλŠ” μš”μ†Œλ₯Ό μ„ νƒν•œλ‹€.
filter() κΈ°μ‘΄ μ„ νƒλœ μš”μ†Œμ—μ„œ μ§€μ •ν•œ μ„ νƒμž 쑰건에 λ§Œμ‘±ν•˜λŠ” μš”μ†Œλ₯Ό μ„ νƒν•œλ‹€.
has() κΈ°μ‘΄ μ„ νƒλœ μš”μ†Œμ˜ 후손 μ€‘μ—μ„œ μ§€μ •ν•œ μ„ νƒμž 쑰건을 λ§Œμ‘±ν•˜λŠ” μš”μ†Œλ₯Ό μ„ νƒν•œλ‹€.
not() κΈ°μ‘΄ μ„ νƒλœ μš”μ†Œμ—μ„œ μ§€μ •ν•œ μ„ νƒμž 쑰건을 λ§Œμ‘±ν•˜μ§€ μ•ŠλŠ” μš”μ†Œλ₯Ό μ„ νƒν•œλ‹€.
slice() κΈ°μ‘΄ μ„ νƒλœ μš”μ†Œμ˜ μ‹œμž‘ μœ„μΉ˜λΆ€ν„° λ§ˆμ§€λ§‰ μœ„μΉ˜κΉŒμ§€ μ§€μ •ν•΄ 일뢀 μš”μ†Œλ₯Ό μ„ νƒν•œλ‹€.
map() λ©”μ„œλ“œμ˜ 인자둜 μ „λ‹¬λœ 읡λͺ… ν•¨μˆ˜μ— μ„ νƒλœ μš”μ†Œλ₯Ό ν•˜λ‚˜μ”© μ „λ‹¬ν•˜μ—¬ 반볡 μ‹€ν–‰ν•œλ‹€.
is() μ„ νƒλœ μš”μ†Œκ°€ μ§€μ •λœ μ„ νƒμžλ‘œ 선택될 수 μžˆλŠ” μš”μ†ŒμΈμ§€λ₯Ό true/false둜 λ¦¬ν„΄ν•œλ‹€.

트리 νš‘λ‹¨ 탐색 λ©”μ„œλ“œ

트리 νš‘λ‹¨ 탐색 λ©”μ„œλ“œλŠ” ν˜„μž¬ μ„ νƒλœ μš”μ†Œ λ…Έλ“œ μ€‘μ‹¬μœΌλ‘œ μƒλŒ€ 경둜둜 λ‹€λ₯Έ λ…Έλ“œλ₯Ό μ„ νƒν•˜λŠ” κΈ°λŠ₯을 μ œκ³΅ν•œλ‹€.

λ©”μ„œλ“œ μ„€λͺ…
find() ν˜„μž¬ μ„ νƒλœ μš”μ†Œμ˜ 후손 μ€‘μ—μ„œ μ§€μ •λœ μ„ νƒμžλ‘œ 선택될 수 μžˆλŠ” μš”μ†Œλ₯Ό λͺ¨λ‘ μ„ νƒν•œλ‹€.
prev() ν˜„μž¬ μ„ νƒλœ μš”μ†Œμ˜ ν˜•μ œ μš”μ†Œ 쀑 이전 μš”μ†Œλ₯Ό μ„ νƒν•œλ‹€.
prevAll() ν˜„μž¬ μ„ νƒλœ μš”μ†Œμ˜ ν˜•μ œ μš”μ†Œ 쀑 이전 μš”μ†Œ λͺ¨λ‘ μ„ νƒν•œλ‹€.
prevUntil() ν˜„μž¬ μ„ νƒλœ μš”μ†Œμ˜ ν˜•μ œ μš”μ†Œ 쀑 이전 μš”μ†Œκ°€ μ§€μ •λœ μ„ νƒμžμ— λΆ€ν•©λ˜λŠ” μš”μ†Œλ₯Ό λͺ¨λ‘ μ„ νƒν•œλ‹€.
next() ν˜„μž¬ μ„ νƒλœ μš”μ†Œμ˜ ν˜•μ œ μš”μ†Œ 쀑 λ‹€μŒ μš”μ†Œλ₯Ό μ„ νƒν•œλ‹€.
nextAll() ν˜„μž¬ μ„ νƒλœ μš”μ†Œμ˜ ν˜•μ œ μš”μ†Œ 쀑 λ‹€μŒ μš”μ†Œ λͺ¨λ‘ μ„ νƒν•œλ‹€.
nextUntil() ν˜„μž¬ μ„ νƒλœ μš”μ†Œμ˜ ν˜•μ œ μš”μ†Œ 쀑 λ‹€μŒ μš”μ†Œκ°€ μ§€μ •λœ μ„ νƒμžμ— λΆ€ν•©λ˜λŠ” μš”μ†Œλ₯Ό λͺ¨λ‘ μ„ νƒν•œλ‹€.
siblings() ν˜„μž¬ μ„ νƒλœ μš”μ†Œμ˜ ν˜•μ œ μš”μ†Œλ₯Ό μ„ νƒν•œλ‹€.
parent() ν˜„μž¬ μ„ νƒλœ μš”μ†Œμ˜ λΆ€λͺ¨ μš”μ†Œλ₯Ό μ„ νƒν•œλ‹€.
parents() ν˜„μž¬ μ„ νƒλœ μš”μ†Œμ˜ 쑰상 μš”μ†Œλ₯Ό λͺ¨λ‘ μ„ νƒν•œλ‹€. μ΅œμƒμœ„ <html> μš”μ†ŒκΉŒμ§€ λͺ¨λ‘ μ„ νƒν•œλ‹€.
closest() 쑰상 μš”μ†Œ 쀑 μ§€μ •λœ μ„ νƒμžμ— λΆ€ν•©λ˜λŠ” μš”μ†Œ ν•˜λ‚˜λ§Œμ„ μ„ νƒν•œλ‹€.
children() ν˜„μž¬ μ„ νƒλœ μš”μ†Œμ˜ λͺ¨λ“  직계 μžμ‹ μš”μ†Œλ₯Ό μ„ νƒν•œλ‹€.

기타 νš‘λ‹¨ 탐색 λ©”μ„œλ“œ

λ©”μ„œλ“œ μ„€λͺ…
add() ν˜„μž¬ μ„ νƒλœ μš”μ†Œ μ§‘ν•©κ³Ό μƒˆλ‘œμ΄ μ„ νƒν•œ μš”μ„œμ˜ 합집합을 λ§Œλ“ λ‹€.
addBack() ν˜„μž¬ μ„ νƒλœ μš”μ†Œ μ§‘ν•©κ³Ό 이전에 μ„ νƒλœ μš”μ†Œ 집합을 ν•©ν•˜μ—¬ μƒˆλ‘œμš΄ 집합을 λ§Œλ“ λ‹€.
end() 직전 λ‹¨κ³„μ—μ„œ μ„ νƒλ˜μ—ˆλ˜ μš”μ†Œλ₯Ό μ„ νƒν•œλ‹€.
contents() 직계 μžμ‹ μ€‘μ—μ„œ μ½˜ν…μΈ λ₯Ό λͺ¨λ‘ μ„ νƒν•œλ‹€. 주석, ν…μŠ€νŠΈλ„ μ½˜ν…μΈ λ‘œ κ°„μ£Όλœλ‹€.
each() jQuery 객체가 μ„ νƒν•˜κ³  μžˆλŠ” 객체λ₯Ό μ΄μš©ν•΄ 반볡 처리 μž‘μ—…μ„ μˆ˜ν–‰ν•œλ‹€.

μš”μ•½

선택 μ„±λŠ₯ ν–₯상
κ°€μž₯ μ€‘μš”ν•œ 점은 λ¬Έμ„œ μ „μ²΄μ—μ„œ μ°Ύμ•„ μ„ νƒν•˜λŠ” μž‘μ—…μ˜ 횟수λ₯Ό μ€„μ΄λŠ” 것이닀. 특히 μ„ νƒμž μ€‘μ—μ„œ ν•„ν„° μ„ νƒμžλ‚˜ νŠΉμ„± μ„ νƒμžμ˜ 경우 κΈ°λŒ€ν•˜λŠ” 것보닀 μ„±λŠ₯이 맀우 μ’‹μ§€ μ•Šλ‹€. μ΄λŸ¬ν•œ μ„ νƒμžλ₯Ό μ΄μš©ν•΄ λ¬Έμ„œ μ „μ²΄μ—μ„œ λ°˜λ³΅ν•΄μ„œ μ„ νƒν•œλ‹€λ©΄ μ—„μ²­λ‚œ μ„±λŠ₯ μ €ν•˜κ°€ 일어날 수 μžˆλ‹€. νš‘λ‹¨ 탐색 λ©”μ„œλ“œλŠ” μ΄λŸ¬ν•œ λ¬Έμ œμ— λŒ€ν•œ 쒋은 해결책이 λœλ‹€.

λͺ…ν™•ν•œ 선택
μ„ νƒμžλ§ŒμœΌλ‘œλŠ” ν‘œν˜„μ΄ νž˜λ“  것도 νš‘λ‹¨ 탐색 λ©”μ„œλ“œλ₯Ό μ΄μš©ν•˜λ©΄ κΉ”λ”ν•˜κ²Œ ν‘œν˜„ν•  수 μžˆλ‹€. 특히 add(), find() λ“±μ˜ λ©”μ„œλ“œκ°€ κ·ΈλŸ¬ν•˜λ‹€. λ³΅μž‘ν•œ μ„ νƒμžλ₯Ό ν•œλ²ˆμ— μž‘μ„±ν•˜λ € ν•˜μ§€ 말고, κΈ°λ³Έ μ„ νƒμžλ‘œ μ„ νƒν•œ ν›„ νš‘λ‹¨ 탐색 λ©”μ„œλ“œλ‘œ 마무리 μ§“λŠ” 것이 훨씬 λͺ…ν™•ν•˜λ‹€.

Clone this wiki locally