المحدد ‎‎‎:only-of-type‎ في 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.

المحدد ‎:only-of-type

الوصف

يختار هذا المحدِّد جميع العناصر التي تكون ابنًا وحيدًا للعنصر الأب (أي العنصر الذي ليس لديه أية عناصر إخوة) وتملك اسم  ذلك العنصر نفسه.

jQuery( ":only-child" )‎

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

إن كان للعنصر الأب عنصر ابن آخر (عنصرين أو أكثر) من نفس الاسم، فلن يتطابق أي عنصر.

أمثلة

تغيير نص وشكل إطار كل زر يكون عنصرًا وحيدًا ضمن العنصر الأب ومن النوع نفسه:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>only-of-type مثالٌ عن استعمال المحدد</title>
  <style>
  div {
    width: 100px;
    height: 80px;
    margin: 5px;
    float: left;
    background: #b9e;
  }
  span {
    padding: 2px;
    margin: 3px;
    line-height: 1.4;
    border: 1px solid #000;
  }
  </style>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
 
<div>
  <button>عنصر أخ</button>
  <button>عنصر أخ</button>
</div>
 
<div>
  <button>عنصر أخ</button>
</div>
<div>
  None
</div>
 
<div>
  <button>عنصر أخ</button>
  <span>عنصر أخ</span>
  <span>عنصر أخ</span>
</div>
 
<div>
  <button>عنصر أخ</button>
</div>
 
<script>
  $( "button:only-of-type" ).text( "عنصر وحيد" ).css( "border", "2px blue solid" );
</script>
 
</body>
</html>

مصادر