סלקטור מרובה

תיאור: בוחר את התוצאות המשולבות של כל הסלקטורים שצוינו.

jQuery('selector1, selector2, selectorN')

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

selector1

אלמנט

כל סלקטור חוקי.

selector2

אלמנט

סלקטור חוקי אחר.

selectorN

אלמנט

מספר סלקטורים חוקים לפי רצונכם.

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

דוגמאות

דוגמה 1

מחפש אלמנטים תואמים לאחד משלושה סלקטרים האלה

$("div,span,p.myClass").css("border","3px solid red");

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

נסה זאת בעצמך

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

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>  
  <script>
  $(document).ready(function(){
$("div,span,p.myClass").css("border","3px solid red");
  });
  </script>
  <style>
  div,span,p {
    width: 130px;
    height: 60px;
    float:left;
    padding: 3px;
    margin: 2px;
    background-color: #EEEEEE;
    font-size:14px;
  }
  </style>
</head>
<body>
  <div>div</div>
  <p class="myClass">p class="myClass"</p>
  <p class="notMyClass">p class="notMyClass"</p>
  <span>span</span>
</body>
</html>

נסה זאת בעצמך

דוגמה 2

מציג סדר של אובייקט jQuery.

    var list = $("div,p,span").map(function () {
      return this.tagName;
    }).get().join(", ");
    $("b").append(document.createTextNode(list));

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

נסה זאת בעצמך

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

<!DOCTYPE html>
<html>
<head>
  <style>
  b { color:red; font-size:16px; display:block; clear:left; }
  div,span,p { width: 40px; height: 40px; float:left;
               margin: 10px; background-color: blue; 
               padding:3px; color:white; 
             }
  </style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <span>span</span>

  <p>p</p>
  <p>p</p>
  <div>div</div>
  <span>span</span>

  <p>p</p>
  <div>div</div>
  <b></b>
<script>
    var list = $("div,p,span").map(function () {
      return this.tagName;
    }).get().join(", ");
    $("b").append(document.createTextNode(list));
</script>

</body>
</html>

נסה זאת בעצמך

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

כן לא

סלקטור מרובה