المحدد ‎:first-child()‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎ في jQuery

من موسوعة حسوب
اذهب إلى التنقل اذهب إلى البحث
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

المحدد ‎:first-child

الوصف

يحدد كل العناصر التي تكون أول ابن للعنصر الأب الذي تتبع له.

jQuery( ":first-child" )‎

أُضيف مع الإصدار: 1.1.4.

في حين أن ‎:first لا يتطابق إلا مع عنصر واحد فقط، يمكن أن يتطابق المُحدد ‎:first-child مع أكثر من عنصر بواقع عنصر واحد لكل أب. وهو يعادل ‎:nth-child(1)‎.

أمثلة

العثور على أول <span> في كل <div> مطابقة لوضع خط تحت النص وإضافة تنسيق عند مرور مؤشر الفأرة فوق العنصر:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>first-child demo</title>
  <style>
  span {
    color: #008;
  }
  span.sogreen {
    color: green;
    font-weight: bolder;
  }
  </style>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
 
<div>
  <span>John,</span>
  <span>Karl,</span>
  <span>Brandon</span>
</div>
<div>
  <span>Glen,</span>
  <span>Tane,</span>
  <span>Ralph</span>
</div>
 
<script>
$( "div span:first-child" )
  .css( "text-decoration", "underline" )
  .hover(function() {
    $( this ).addClass( "sogreen" );
  }, function() {
    $( this ).removeClass( "sogreen" );
  });
</script>
 
</body>
</html>

مصادر