Heim >Web-Frontend >js-Tutorial >So verwenden Sie die insertBefore()-Methode von jQuery
So verwenden Sie die insertBefore()-Methode von jQuery
- 青灯夜游Original
- 2019-02-14 15:05:035105Durchsuche
Die Methode insertBefore() von jQuery wird verwendet, um HTML-Inhalte vor einem angegebenen Element einzufügen. Die Verwendungssyntax lautet „$(content).insertBefore(target)“.
Die Betriebsumgebung dieses Artikels: Windows 7-System, Dell G3-Computer, JQuery-Version 3.2.1.
insertBefore() ist eine integrierte Methode von jQuery, die zum Einfügen von HTML-Inhalten vor einem angegebenen Element verwendet wird. Der folgende Artikel stellt Ihnen die Verwendung von insertBefore() vor und hoffe, dass er Ihnen hilfreich sein wird.
jQuerys insertBefore()-Methode
insertBefore()-Methode fügt HTML-Inhalt vor jedem Vorkommen des angegebenen Elements ein. [Empfohlenes Video-Tutorial: jQuery-Tutorial]
Grundlegende Satzstruktur:
$(content).insertBefore(target)
Anleitung:
content: Gibt den HTML-Inhalt an, der vor dem angegebenen Ziel eingefügt werden muss.
Ziel: Gibt das angegebene Ziel an.
Verwendungsbeispiel der Methode insertBefore()
Beispiel 1:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="jquery.min.js"></script>
<script>
$(document).ready(function() {
$(".demo").click(function() {
// insertBefore
$("<div>在PHP中文网中学习！</div>").insertBefore("p");
});
});
</script>
</head>
<body>
<div class="box">
<p>学习jQuery</p>
<div class="demo">单击此处</div>
</div>
</body>
</html>Rendering:
Erklärung:
Wenn das DOM (Document Object Model) geladen wurde und die Seite (einschließlich Bilder) vollständig gerendert wurde, Das Ready-Ereignis wird eintreten. Die Funktion ready() gibt jedoch den Code an, der ausgeführt werden muss, wenn das Ready-Ereignis eintritt.
$(".demo").click(): Gibt den Code an, der ausgeführt werden muss, wenn ein Klickereignis auf dem .demo-Element auftritt.
Beispiel 2:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="jquery.min.js"></script>
<script>
$(document).ready(function() {
$(".demo").click(function() {
// insertBefore
$("<div>在PHP中文网中学习！</div>").insertBefore("p");
});
});
</script>
</head>
<body>
<div class="box">
<p>学习jQuery</p>
<p>学习php</p>
<div class="demo">单击此处</div>
</div>
</body>
</html>Rendering:
Das Obige ist der gesamte Inhalt dieses Artikels, I Ich hoffe, es kann für das Studium aller hilfreich sein. Weitere spannende Inhalte finden Sie in den entsprechenden Tutorial-Kolumnen auf der chinesischen PHP-Website! ! !
Das obige ist der detaillierte Inhalt vonSo verwenden Sie die insertBefore()-Methode von jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!