Die Innerhtml kann zum Schreiben des HTML -Dokuments dynamisch verwendet werden. Es wird hauptsächlich für die Generierung dynamischer HTML -Dokumente bereitgestellt, einschließlich Kommentarformulare, Registrierungsformulare, Links und vieler mehr. Darüber hinaus können Sie die Innerhtml in einem Div durch Hilfe von JQuery ersetzen. Um dies zu tun, die “.html ()Die Funktion wird verwendet. Wenn Sie nach dem Laden der Website auf die Schaltfläche klicken, wird der Inhalt innerhalb des DIV mit dem Inhalt der Funktion html () geändert.

Diese Beschreibung zeigt, wie die Innerhtml eines DIV unter Verwendung von JQuery ersetzt wird.

So ersetzen Sie die Innerhtml eines DIV mit JQuery?

Um die Innerhtml eines DIV-Behälters zu ersetzen, das JQuery verwendet, befolgen Sie die folgende Prozedur.

Schritt 1: Erstellen Sie einen Hauptbehälter „Div“

Erstellen Sie zunächst den Hauptbehälter „DIV“, indem Sie das „verwenden“Element ”und fügen Sie eine ID in das Eröffnungs -Tag" Div "mit einem bestimmten Namen hinzu.

Schritt 2: Überschriften hinzufügen

Verwenden Sie als nächstes einen beliebigen Überschriften -Tag von “H1" Zu "H6”So fügen Sie einer HTML -Seite eine Überschrift hinzu. Zum Beispiel haben wir verwendet “H1"Für die Hauptüberschrift und"H2”Für die zweite Überschrift. Sie können auch das Inline -Styling im Überschriften -Tag definieren.

Schritt 3: Machen Sie einen weiteren Div -Behälter

Machen Sie danach einen weiteren Div -Container, indem Sie im vorherigen Schritt dieselbe Methode befolgen.

Schritt 4: Erstellen Sie eine Schaltfläche

Fügen Sie dann eine Taste mit Hilfe der "hinzu"" Element. Auch ein "fügen Sie eine" hinzu "Klasse”Attribut innerhalb des DIV -Eröffnungs -Tags und weisen Sie diesem Attribut zwei oder mehr Klassennamen zu. Der "TypDas Attribut wird verwendet, um den Typ des Elements anzugeben. Dann einbetten Text inzwischen “einbettenTaste”Element zum Anzeigen auf der Schaltfläche:

LinuxHint Ltd UK

Erster Inhalt ohne Änderung

Die Ausgabe des obigen Codeblocks ist unten angegeben:

Schritt 3: Wenden Sie CSS auf den Container „Div“ an

Zugriff auf die zweite “div"Container mit Hilfe des Klassennamens".Zweitbetrag”:

.Zweitbetrag
Text-Align: Mitte;

Wenden Sie nach dem Zugriff auf den Div -Container die “anTextausrichtung”Eigenschaft von CSS, die zur Festlegung der Ausrichtung des Textes verwendet wird.

Ausgang

Schritt 4: Fügen Sie die JQuery -Bibliothek ein

Wir werden die JQuery -Bibliothek hinzufügen, indem wir den folgenden Link in das Tag zwischen dem Kopfelement der HTML -Datei einfügen:

Schritt 5: Ersetzen Sie die Innerhtml von Div

Im "”Tag, fügen Sie den folgenden Code hinzu:

Im obigen Code -Snippet:

• • Definiere das "bereit()Die Funktion, die nur ausgeführt wird, sobald das Seitenmodell des Seitendokumentobjekts (DOM) für den JavaScript -Code bereit ist, um auszuführen.
  • Erstellen Sie eine Funktion für das Tastenelement für die Ausführung der Aktion, wenn der Benutzer darauf eintritt.
  • Jetzt die "&(Wähler).html ()Die Funktion wird zum Ersetzen des innerenhtml von Div verwendet. Fügen Sie dazu die Daten in die “hinzu“()" ersetzen.

Es kann beobachtet werden, dass das innere Halt der DIV geändert wurde, wenn die Schaltfläche angeklickt wird:

Sie haben gelernt, die Innerhtml eines DIV mit JQuery zu ersetzen.

Abschluss

Um die Innerhtml eines DIV durch JQuery zu ersetzen, fügen Sie zunächst einen Link der JQuery -Bibliothek in das Skript -Tag mit Hilfe des "src”Attribut. Dann ist die "html ()"Funktion wird als" verwendet "&(Wähler).html”. Um dies zu tun, die “$ ("#First-Div").html”Wird in diesem Szenario verwendet. In dieser Beschreibung wurde die Methode zum Ersetzen der Innerhtml eines Div-Containers mit JQuery erläutert.