parentsUntil()

.parentsUntil( [selector,] [filter] )

מחזירה: jQuery

תיאור: מקבל את אבותיהם של כל אלמנט בקבוצה נוכחית של אלמנטים בהתאמה, עד אך לא כולל אלמנט התואם לסלקטור, צומת DOM או אובייקט jQuery.

.parentsUntil( [selector,] [filter] )

הוספה בגרסה: 1.4

selector

מחרוזת

מחרוזת שמכילה ביטוי בחירה, כדי לסמן היכן לעצור התאמת אלמנטים אב הקדמון.

filter

מחרוזת

מחרוזת המכילה ביטוי בחירה כדי להתאים לאלמנטים.

.parentsUntil( [element,] [filter] )

הוספה בגרסה: 1.6

element

אובייקט, צומת DOM

הצומת DOM או אובייקט jQuery המציין היכן לעצור התאמת אלמנטים אב הקדמון.

filter

מחרוזת

מחרוזת המכילה ביטוי בחירה כדי להתאים לאלמנטים.

בהינתן אובייקט jQuery, שמספק קבוצת אלמנטים DOM, שיטה .parentsUntil() מאפשרת לנו לחפש בממשיכי אלמנטים האלה עד לאלמנט, בהתאם לסלקטור, שנשלח בשיטת ארגומנט. אובייקט תוצאה jQuery מכיל כל האחים עד, אבל לא כולל אחד, שצוין בסלקטור .parentsUntil().

נתבונן על דף עם רשימה מקוננת:

<ul class="level-1">
  <li class="item-i">I</li>
  <li class="item-ii">II
    <ul class="level-2">
      <li class="item-a">A</li>
      <li class="item-b">B
        <ul class="level-3">
          <li class="item-1">1</li>
          <li class="item-2">2</li>
          <li class="item-3">3</li>
        </ul>
      </li>
      <li class="item-c">C</li>
    </ul>
  </li>
  <li class="item-iii">III</li>
</ul>

אם אנחנו נתחיל מ- item A, אנחנו יכולים למצוא אבותיו עד, אבל לא כולל <ul class="level-1">:

$('li.item-a').parentsUntil('.level-1').css('background-color', 'red');

תוצאה של הפעלה הזו יהיה רקע אדום עבור level-2 ועבור item II.

אם סלקטור לא תואם או לא סופק, אובייקט jQuery המוחזר יכיל כל אבותיו של אובייקט jQuery. לדוגמה, נניח שאנו מתחילים שוב מ- item A, אבל הפעם אנחנו משתמשים בסלקטור, שלא תואם לאחד מאבותיו:

$('li.item-a').parentsUntil('.not-here').css('background-color', 'red');

התוצאה של הפעלה הזו היא סגנון קרע אדום שהוסף לרשימה level-2, item II, לרשימה level-1, לאלמנט <body>, ולאלמנט <html>.

החל מ- jQuery 1.6, צומת DOM או אובייקט jQuery, במקום סלקטור, ניתן להשתמש עבור ארגטומנט ראשון של .parentsUntil().

דוגמא

מוצא כל האבותיהם של <li class="item-a"> עד <ul class="level-1"> ונותן להם צבע רקע אדום.

  $('li.item-a').parentsUntil('.level-1').css('background-color', 'red');

תוצאת הפעלה קוד לעיל:

נסה זאת בעצמך

דוגמא - קוד מלא:

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
  
  <script type="text/javascript" language="javascript">
  $(document).ready(function(){
        $('li.item-a').parentsUntil('.level-1').css('background-color', 'red');
   });
  </script>

</head>
<body>
	
<ul class="level-1">

  <li class="item-i">I</li>
  <li class="item-ii">II
    <ul class="level-2">
      <li class="item-a">A</li>
      <li class="item-b">B
        <ul class="level-3">

          <li class="item-1">1</li>
          <li class="item-2">2</li>
          <li class="item-3">3</li>
        </ul>

      </li>
      <li class="item-c">C</li>
    </ul>
  </li>
  <li class="item-iii">III</li>

</ul>
<script>
    $('li.item-a').parentsUntil('.level-1')
      .css('background-color', 'red');
</script>
</body>
</html>

נסה זאת בעצמך

האם מידע זה היה מועיל?

כן לא

parentsUntil()

.parentsUntil( [selector,] [filter] )

.parentsUntil( [selector,] [filter] )

.parentsUntil( [element,] [filter] )

דוגמא

דוגמא - קוד מלא:

תגובות