So fügen Sie jQuery-Elemente hinzu und löschen sie

Aufgrund der Arbeitsanforderungen ist es häufig erforderlich, Elemente hinzuzufügen, zu löschen, zu ändern und zu suchen. In diesem Artikel erfahren Sie, wie Sie jQuery-Elemente hinzufügen und löschen. Freunde in Not können darauf verweisen, ich hoffe, es ist für Sie nützlich.

DOM ist die Abkürzung für Document Object Modeule. Im Allgemeinen werden DOM-Operationen in drei Aspekte unterteilt.

1. DOM Core

DOM Core ist nicht exklusiv für Javascript. Jede Programmiersprache, die DOM unterstützt, kann es verwenden, und seine Verwendungsmöglichkeiten gehen weit über die reine Nutzung von Webseiten hinaus kann auch verwendet werden, um jedes Dokument zu verarbeiten, das in einer Auszeichnungssprache wie XML geschrieben ist.
Zum Beispiel: document,getElementsByTagName("form");//Verwenden Sie DOM Core, um das Formularobjekt abzurufen.

2. HTML-DOM

Bei der Verwendung von Javascript und DOM zum Schreiben von Skripten für HTML-Dateien gibt es viele Attribute, die zum HTML-DOM gehören -DOM ist noch früher als DOM Core und bietet einige prägnantere Notationen zur Beschreibung der Attribute verschiedener HTML-Elemente.
Zum Beispiel: document.forms //HTML-DOM stellt ein Formularobjekt bereit.
PS: Es ist ersichtlich, dass das Abrufen von Objekten und Attributen mithilfe von DOM Core oder HTML-DOM implementiert werden kann.

3. CSS-DOM

CSS-DOM ist eine Operation für CSS. In Javascript besteht die Hauptfunktion von CSS-DOM darin, verschiedene Aspekte abzurufen und festzulegen das Stilobjekt. Mit diesem Attribut kann die Webseite verschiedene Effekte darstellen.
Zum Beispiel: element.style.color=“red“;//Methode zum Festlegen der Schriftfarbe eines Elements.

Gemeinsame Methoden

1. Elementknoten finden

var $li = $(“ul li:eq(0)”);//获取ul标记下的第一个li,也可以写成 $(“#ulID li:eq(0)”);

2. Elementattribute finden

Verwenden Sie die attr()-Methode von jquery, um die Werte verschiedener Attribute des Elements zu erhalten. Der Parameter der attr()-Methode kann eins oder zwei sein.
Wenn der Parameter eins ist, ist es der Name des abzufragenden Attributs.
Wenn zwei Parameter vorhanden sind, können Sie den Wert des Attributs festlegen.

alert($(“#id”).attr(“title”)); //输出元素的title属性.一个参数
$(“#id”).attr(“title”,”改变title值”); //改变元素的title属性值.二个参数

3. Elementknoten hinzufügen

$(html) Erklären Sie kurz, dass die $(html)-Methode ein Dom-Objekt basierend auf der eingehenden HTML-Tag-Zeichenfolge erstellt. Und packen Sie dieses Dom-Objekt in ein JQuery-Objekt ein und geben Sie es zurück. Kurz gesagt, fügen Sie einfach den gesamten HTML-Code der Marke in die $()-Factory ein!
Beispiel:

 var $htmlLi = $(”  <li title=’香蕉’>香蕉</li>”);  //创建DOM对象
         var $ul = $(“ul”);   //获取UL对象
         $ul.append($htmlLi); //将$htmlLi追加到$ul元素的li列表

4. Elementknoten löschen

Da wir DOM-Elemente häufig dynamisch ändern müssen, bietet Jquery zwei Arten von Methoden zum Löschen von Knoten , nämlich remove() und empty();

4.1 Methode „remove()“

$(“p”).remove();// Wir können das bekommen Zu löschendes Element und dann die Methode „remove()“ aufrufen
$("ul li:eq(0)").remove().appendTo("ul"); und fügen Sie dann die gelöschte li-Markierung wieder zu ul hinzu. Die Methode „remove()“ gibt die Referenz des gelöschten Elements zurück. Zu diesem Zeitpunkt können Sie weiterhin
$(„ul li“).remove(„li[title != ABC]");//remove kann Parameter akzeptieren, um qualifizierte Elemente selektiv zu löschen;

4.2 empty()-Methode

Genau genommen leer Die ()-Methode löscht keine Elemente, sondern löscht
Beispiel:

HTML代码
       <ul>
          <li title=”AAA”>AAA</li>
       </ul>
      JQuery代码
      $(“ul li:eq(0)”).empty();

Ergebnis

    <ul>
          <li title=”AAA”></li>
       </ul>

Denken Sie daran, dass nur der Inhalt gelöscht wird, nicht die Attribute.

Das obige ist der detaillierte Inhalt vonSo fügen Sie jQuery-Elemente hinzu und löschen sie. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!