Heim > Artikel > Web-Frontend > Kann JQuery Elemente zu Divs hinzufügen?

Kann JQuery Elemente zu Divs hinzufügen?

青灯夜游Original: 2022-04-21 13:09:375005Durchsuche

jquery kann Elemente zu Divs hinzufügen. Methoden: 1. Verwenden Sie „$(“div“).append(new element)“, um neue Elemente am Ende des div hinzuzufügen ("div")"-Anweisung; 3. Verwenden Sie "$("div").prepend(new element)".

Die Betriebsumgebung dieses Tutorials: Windows7-System, jquery1.10.2-Version, Dell G3-Computer.

jquery kann Elemente zu Divs hinzufügen.

Das Hinzufügen von Elementen zu einem Div bedeutet das Hinzufügen von Unterelementen zum Div. In diesem Artikel werden sie Ihnen vorgestellt.

4 Möglichkeiten, untergeordnete Elemente zu divs mit jquery hinzuzufügen

Methode 1: Verwenden Sie die append()-Methode

Verwenden Sie die append()-Methode, um untergeordnete Elemente am „Ende“ innerhalb des div-Elements hinzuzufügen .

Syntax:

$(A).append(B)

bedeutet das Einfügen von B am Ende von A.

Beispiel:

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(function () {
            $("#btn").click(function () {
                var newp = "<p>一个新段落</p>";
                $("div").append(newp);
            })
        })
    </script>
	</head>
	<body>
		<div style="background-color: #FF0000;">
			<p>第一段文本</p>
			<p>第二段文本</p>
			<p>第三段文本</p>
		</div>
		<input id="btn" type="button" value="插入" />
	</body>
</html>

Kann JQuery Elemente zu Divs hinzufügen?

Methode 2: Verwenden Sie die appendTo()-Methode.

appendTo( ) kann auch Unterelemente zum „Ende“ innerhalb des div-Elements hinzufügen,

appendTo( ) und append ( ) Obwohl die Funktionen dieser beiden Methoden ähnlich sind, sind ihre Betriebsziele vertauscht.

Syntax:

$(A).appendTo(B)

bedeutet, dass A am Ende von B eingefügt wird.

Beispiel:

$(function () {
	$("#btn").click(function () {
		var newp = "<p>一个新段落</p>";
		$(newp).appendTo("div");
		
	})
})

Kann JQuery Elemente zu Divs hinzufügen?

Methode 3: Verwenden Sie prepend( )

Die prepend( )-Methode kann untergeordnete Elemente am „Anfang“ innerhalb des div-Elements hinzufügen.

Syntax:

$(A).prepend(B)

bedeutet das Einfügen von B am Anfang von A.

Beispiel:

$(function () {
	$("#btn").click(function () {
		var newp = "<p>一个新段落</p>";
		$("div").prepend(newp);
	})
})

Kann JQuery Elemente zu Divs hinzufügen?

Methode 4: Verwenden Sie prependTo( )

prependTo( ) kann auch untergeordnete Elemente zum „Anfang“ innerhalb des div-Elements hinzufügen.

prependTo( ) und prepend( ) Obwohl die Funktionen dieser beiden Methoden ähnlich sind, sind ihre Operationsobjekte umgekehrt.

Syntax:

$(A).prependTo(B)

bedeutet, dass A am Anfang von B eingefügt wird.

Beispiel:

$(function () {
	$("#btn").click(function () {
		var newp = "<p>一个新段落</p>";
		$(newp).prependTo("div");
		
	})
})

Kann JQuery Elemente zu Divs hinzufügen?

【Empfohlenes Lernen: jQuery-Video-Tutorial, Web-Frontend-Video】

Das obige ist der detaillierte Inhalt vonKann JQuery Elemente zu Divs hinzufügen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

jquery append 对象

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Wozu dient der React-Schlüssel?Nächster Artikel：Wozu dient der React-Schlüssel?

In Verbindung stehende Artikel

Mehr sehen