Heim > Artikel > Web-Frontend > Anwendungsbeispiele der Methode after() in jQuery
Dieser Artikel stellt hauptsächlich die Verwendung der after()-Methode in jQuery vor. Er analysiert die Funktion, Eigenschaften und Verwendungsfähigkeiten der after()-Methode im Detail und hat einen bestimmten Referenzwert es kann darauf verweisen.
Das Beispiel in diesem Artikel beschreibt die Verwendung der after()-Methode in jQuery. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:
Diese Methode kann HTML-Inhalte an das äußere Ende jedes übereinstimmenden Elements anhängen.
Besonderer Hinweis:
Diese Methode dient zum Anhängen von Inhalten, d. h. der ursprüngliche Inhalt ist noch vorhanden.
HTML-Inhalt bedeutet, dass der Inhalt das HTML-Tag enthalten und vom Browser gerendert werden kann.
Der Textinhalt besteht darin, zunächst die vordefinierten HTML-Zeichen im Inhalt in HTMLZeichenentitäten umzuwandeln, sodass die HTML-Tags nicht gerendert werden.
Grammatikstruktur:
Der Code lautet wie folgt:
$(selector).after(content)
Beispielcode:
Beispiel 1:
Der Code lautet wie folgt:
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.jb51.net/" /> <title>脚本之家</title> <style type="text/css"> p { height:150px; width:150px; background-color :green; margin-top :10px; } </style> <script type="text/ javascript " src="mytest/jQuery/jquery-1.8.3.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("p").after("<b> 好好学习</b>"); }) </script> </head> <body> <p></p> </body> </html>
Inhalt nach dem ursprünglichen p-Inhalt anhängen.
Beispiel 2:
Der Code lautet wie folgt:
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.jb51.net/" /> <title>脚本之家</title> <style type="text/css"> p { height:150px; width:150px; background-color:green; margin-top:10px; } </style> <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("button").click(function(){ $(".html").after("<b>好好学习</b>"); $(".text").text("<b>好好学习</b>"); }) }) </script> </head> <body> <p class="html"></p> <p class="text"></p> <button>点击查看效果</button> </body> </html>
Anhand dieses Beispiels können Sie den Unterschied zwischen HTML-Inhalt und Textinhalt beobachten.
Das obige ist der detaillierte Inhalt vonAnwendungsbeispiele der Methode after() in jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!