remove()

.remove( [ selector ] )

מחזירה: jQuery

תיאור: מוחק כל האלמנטים בהתאמה מ- DOM.

.remove( [ selector ] )

הוספה בגרסה 1.0

selector

ביטוי jQuery לסינון אלמנטים מיועדים למחיקה.

בדומה ל-.empty(), שיטה .remove() מוחקת כל האלמנטים מ-DOM. אנחנו משתמשים ב-.remove(), כאשר רוצים למחוק אלמנט בעצמו, וגם כל מה שבתוכו. בנוסף לאלמנטים עצמם, כל האירועים הקשורים ונתוני jQuery, וקשורים לאלמנטים, ימחקו.

נתבונן על HTML הבא:

<div class="container">
  <div class="hello">Hello</div>
  <div class="goodbye">Goodbye</div>
</div>

אנחנו יכולים לבחור כל אלמנט להסרה:

$('.hello').remove();

זה יגרום לכך, שבמבנה של DOM, אלמנט עם <div class="hello"> ימחק:

<div class="container">
  <div class="goodbye">Goodbye</div>
</div>

אם היה לנו מספר בלתי מוגבל של אלמנטים מקוננים בתוך <div class="hello">, הם היו נמחקים גם. בונה jQuery אחרים, כגון נתונים או מטפלי אירועים ימחקו גם כן.

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

$('div').remove('.hello');

זה יגרום לאותו מבנה DOM:

<div class="container">
  <div class="goodbye">Goodbye</div>
</div>

דוגמאות

דוגמה 1

מוחק כל הפסקאות מ- DOM

    
$("button").click(function () {
      $("p").remove();
    });

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

נסה זאת בעצמך

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

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
 
  <script type="text/javascript" language="javascript">

  $(document).ready(function(){
    
    $("button").click(function () {
      $("p").remove();
    });

  });
  </script>

  <style>p { background:yellow; margin:6px 0; }</style>
</head>
<body>

  <p>Hello</p> 
  how are 
  <p>you?</p>

  <button>Call remove() on paragraphs</button>
</body>

</html>

נסה זאת בעצמך

דוגמה 2

מוחק כל הפסקאות המכילות "Hello" מ- DOM

$("button").click(function () {
      $("p").remove(":contains('Hello')");
});

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

נסה זאת בעצמך

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

מוחק כל הפסקאות המכילות "Hello" מ- DOM

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <style>p { background:yellow; margin:6px 0; }</style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>

  <script type="text/javascript" language="javascript">

  $(document).ready(function(){
     $("button").click(function () {
         $("p").remove(":contains('Hello')");
     });
  });
  </script>

</head>

<body>
	<p class="hello">Hello</p>
        how are 
        <p>you?</p>
        <button>Call remove(":contains('Hello')") on paragraphs</button>
</body>
</html>

נסה זאת בעצמך

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

כן לא

remove()

.remove( [ selector ] )

.remove( [ selector ] )

דוגמאות

דוגמה 1

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

דוגמה 2

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

תגובות