Heim >Web-Frontend >js-Tutorial >Detaillierte grafische Erklärung zum Erstellen und Hinzufügen von Knoten mit jQuery
Detaillierte grafische Erklärung zum Erstellen und Hinzufügen von Knoten mit jQuery
- yuliaOriginal
- 2018-10-12 14:41:374507Durchsuche
jQuery ist ein auf JavaScript basierendes Framework. Es wird aufgrund seiner Einfachheit und Bequemlichkeit häufig verwendet. Wissen Sie, wie man Knoten mit jQuery erstellt und hinzufügt? In diesem Artikel erfahren Sie, wie Sie mit jQuery Knoten erstellen und hinzufügen. Interessierte Freunde können darauf verweisen.
Hinweis: Wenn Sie jQuery verwenden, müssen Sie zuerst die jQuery-Datei
Methode 1, append()-Methode
append() kann Knoten hinzufügen und sie am Ende des ausgewählten Elements hinzufügen Beispiel: Drachenfrucht am Ende hinzufügen ungeordnete Liste Dieses Element Beschreibung: Erstellen Sie zuerst ein- -Element hinzu. Der Code lautet wie folgt:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<ul>
<li>榴莲</li>
<li>西瓜</li>
<li>橘子</li>
<li>雪梨</li>
</ul>
<button id="btn">点击添加</button>
</body>
<script type="text/javascript">
$(document).ready(function(){
$("#btn").click(function(){
$("ul").append(" <li>火龙果</li>");
});
});
</script>
</html> Der Effekt ist wie im Bild gezeigt:
Methode 2, prepend()-Methode
Die prepend()-Methode kann Knoten hinzufügen, die am Anfang des ausgewählten Elements hinzugefügt werdenDer Code lautet wie folgt:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<ul>
<li>榴莲</li>
<li>西瓜</li>
<li>橘子</li>
<li>雪梨</li>
</ul>
<button id="btn">点击添加</button>
</body>
<script type="text/javascript">
$(document).ready(function(){
$("#btn").click(function(){
$("ul").prepend(" <li>火龙果</li>");
});
});
</script>
</html>Der Effekt ist wie in der Abbildung gezeigt:
Darüber hinaus gibt es die Methode after() und before() Verfahren. Die after()-Methode in jQuery fügt Inhalte nach dem ausgewählten Element ein, und die before()-Methode fügt Inhalte vor dem ausgewählten Element ein. Das Wesentliche ähnelt append() und prepend() und wird hier nicht demonstriert.
Das obige ist der detaillierte Inhalt vonDetaillierte grafische Erklärung zum Erstellen und Hinzufügen von Knoten mit jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!