Khmer Web: Siblings

យើងបានដឹងរួចមកហើយ ពីការប្រើប្រាស់វិធីផ្សេងៗនៅក្នុងកញ្ចប់ jQuery ក្នុងការស្រង់យកធាតុមេនិងឬធាតុរង មកធ្វើការកែច្នៃ តែលើសពីនេះទៀត យើងក៏អាចស្រង់យកធាតុស្ថិតក្នុងកំរឹតស្មើគ្នា ឬធាតុជាបងប្អូន (sibling) យកមកកែច្នៃបានដែរ ដោយប្រើប្រាស់វិធីទាំងនេះ៖ siblings(), next(), nextAll(), nextUntil(), prev(), prevAll(), prevUntil() ។

ដោយឡែក វិធីឈ្មោះ siblings() អនុញ្ញាតអោយយើងអាចស្រង់យកធាតុស្មើគ្នា (sibling) ទាំងអស់ តាមរយធាតុស្មើគ្នាណាមួយ ដោយធ្វើដូចខាងក្រោមនេះ៖

<!DOCTYPE html>
<html>
  <head>
    
    
  </head>
  <body class="siblings" style="font:14px/1.5 'Odor Mean Chey'">
  
  	div (parent)
  		p
  		span
  		h2
  		h3
  		p
	

   <script>
     $("h2").siblings().css({"color": "red", "border": "2px solid red"});
   </script>

  </body>
</html>

div (parent)

span

h2

h3

ក្នុងករណីយើងចង់ស្រង់យកតែធាតុស្មើគ្នាមួយចំនួន មានប្រភេទជាធាតុ HTML ណាមួយ យើងចាំបាច់ត្រូវធ្វើដូចខាងក្រោមនេះ៖

<!DOCTYPE html>
<html>
  <head>
    
    
  </head>
  <body class="siblings" style="font:14px/1.5 'Odor Mean Chey'">
  
  	div (parent)
  		p
  		span
  		h2
  		h3
  		p
	

   <script>
     $("h2").siblings('p').css({"color": "red", "border": "2px solid red"});
   </script>

  </body>
</html>

div (parent)

span

h2

h3

ចំណែកឯវិធីឈ្មោះ next() អនុញ្ញាតអោយអាចស្រង់យកធាតុស្មើគ្នាបន្ទាប់ពីធាតុណាមួយ។

<!DOCTYPE html>
<html>
  <head>
    
    
  </head>
  <body class="siblings" style="font:14px/1.5 'Odor Mean Chey'">
  
  	div (parent)
  		p
  		span
  		h2
  		h3
  		p
	

   <script>
     $("h2").next().css({"color": "red", "border": "2px solid red"});
   </script>

  </body>
</html>

div (parent)

span

h2

h3

ស្រដៀងគ្នានេះដែរ វិធីឈ្មោះ nextAll() អាចត្រូវយកទៅប្រើសំរាប់ស្រង់យកធាតុស្មើគ្នាទាំងអស់ បន្ទាប់ពីធាតុណាមួយ។

<!DOCTYPE html>
<html>
  <head>
    
    
  </head>
  <body class="siblings" style="font:14px/1.5 'Odor Mean Chey'">
  
  	div (parent)
  		p
  		span
  		h2
  		h3
  		p
	

   <script>
     $("h2").nextAll().css({"color": "red", "border": "2px solid red"});
   </script>

  </body>
</html>

div (parent)

span

h2

h3

តែបើយើងចង់ជ្រើសរើសយកធាតុស្មើគ្នាក្នុងកំរឹតណានោះ យើងអាចប្រើប្រាស់វិធីឈ្មោះ nextUntil() ដោយធ្វើដូចខាងក្រោមនេះ៖

<!DOCTYPE html>
<html>
  <head>
    
    
  </head>
  <body class="siblings" style="font:14px/1.5 'Odor Mean Chey'">
  
  	div (parent)
  		p
  		span
  		h2
  		h3
        h4
  		h5
  		h6
  		p
	

   <script>
     $("h2").nextUntil('h6').css({"color": "red", "border": "2px solid red"});
   </script>

  </body>
</html>

div (parent)

span

h2

h3

h4

h5

h6

យ៉ាងណម៉ិញ វិធីឈ្មោះ prev(), prevAll() and prevUntil() ក៏មានលក្ខណៈដូចវិធីទាំង ៣ ខាងលើនេះដែរ គឺគ្រាន់តែខុសគ្នានៅត្រង់ថា វិធីទាំង ៣ ចុងក្រោយនេះ ជ្រើសរើសយកធាតុស្មើគ្នា មានមុនធាតុស្មើគ្នាណាមួយ៕