JavaScript ist eine der am häufigsten verwendeten Programmiersprachen. Es ist auch sehr beliebt für seine Vielseitigkeit auf allen Plattformen. Es gibt verschiedene Eigenschaften in das erleichtert Ihnen die Erstellung einer dynamischen Website. In diesem Artikel werden wir den inneren HTML-Code in JavaScript in der folgenden Reihenfolge diskutieren:
Einführung in JavaScript
JavaScript wird sowohl als clientseitige Programmiersprache als auch als serverseitige Programmiersprache verwendet. wird zur Ausführung verwendet sowohl auf der Clientseite als auch auf der Serverseite einer Anwendung. Ein Knoten kann an mehreren Stellen auch als Node.js bezeichnet werden.
wie man Eclipse einrichtet
JavaScript bietet eine Vielzahl von Methoden, mit denen verschiedene Funktionen problemlos ausgeführt werden können. Dies hat JavaScript zu einer der beliebtesten Programmiersprachen gemacht und wird auch häufig für verschiedene Arten der Produktentwicklung verwendet.
Inneres HTML in JavaScript
Das Innere Die Eigenschaft in JavaScript ist eine der sehr praktischen Funktionen und wird häufig verwendet, um den erstellten Webseiten einen dynamischeren und vielseitigeren Aspekt zu verleihen.
Wenn wir versuchen, das innerHTML einfach zu erklären, besteht die Arbeit des innerHTML einfach darin, den Seiteninhalt zu laden, ohne die gesamte Seite zu aktualisieren. Dies spart die Datennutzung sowie die Zeit hinter dem Laden der Seite und ist ziemlich einfach zu gewinnen. Dies gibt dem Benutzer ein sehr schnelles und reaktionsschnelles Gefühl, wodurch die Benutzererfahrung viel besser wird.
Es mag etwas schwierig klingen, aber versuchen wir, dies anhand eines Beispiels zu verstehen.
Beispiel:
Klicken Sie hier, um den innerHTML-Text zu ändern.
Funktion myFunction () {document.getElementById ('Absatz1'). innerHTML = 'Absatz geändert!' }}
Hier im obigen Code ist im Absatz-Tag die ID von Absatz 1.
Da ist ein Funktion benannte myfunction (), die beim Klicken auf den Text 'Klicken Sie hier, um innerHTML-Text zu ändern' widerrufen würde.Wenn die Funktion beim Klicken widerrufen wird, wird die Funktion ausgeführt, die getElementById ('Absatz 1') anzeigt, in der angegeben ist, dass das Element mit der ID als Demo ausgewählt werden soll.
Außerdem haben wir die innerHTML-Funktion, die nach dem Klicken einfach bedeutet, was zu tun ist. Hier im obigen Beispiel ist es einfach 'Absatz geändert'.
Unten ist die erste Ausgabe des obigen Codes.
Unten ist die geänderte Ausgabe nach dem Klick.
Inneres HTML mit geordneter oder ungeordneter Liste
Unten sehen Sie ein Beispiel für die Verwendung von innerHTML mit geordneter oder ungeordneter Liste.
Beispiel:
- Hallo
- Hallo wieder
Klicken Sie auf die Schaltfläche unten, um den Inhalt des ul-Elements abzurufen.
Probieren Sie es aus Funktion helloFunction () {var x = document.getElementById ('myList'). InnerHTML document.getElementById ('Absatz1'). InnerHTML = x}Hier wird das innerHTML durch die Schaltfläche ausgelöst, die durch den Namen 'Try it' definiert ist.
Was ist Datenmischung in Tableau
Die erste Ausgabe des obigen Textes lautet:
Die Ausgabe nach dem Klicken auf die Schaltfläche. Das Klicken auf die Schaltfläche führt nicht zum erneuten Laden der Seite, sondern war auf die Verwendung von innerHTML zurückzuführen.
Arten von Gerüsten in Selen
InnerHTML zum Ändern der URL
Unten sehen Sie ein weiteres Beispiel, das die Verwendung von innerHTML zum Ändern der URL beim Klicken auf die Schaltfläche zeigt.
Beispiel:
Wikipedia Ändern Sie die Linkfunktion myFunction () {document.getElementById ('myAnchor'). InnerHTML = 'Google' document.getElementById ('myAnchor'). Href = 'https://www.google.com' document.getElementById ('myAnchor') ) .target = '_blank'}
Das obige Beispiel enthält zunächst den Link zur Wikipedia-Website. Wenn Sie jedoch auf die Schaltfläche klicken, ändert sich der Link zu Google.
Es gibt mehrere solcher Vorgänge, bei denen innerHTML nützlich ist, wenn die Seite nicht neu geladen und nur ein Teil aktualisiert werden soll.Dies spart Zeit und es sind weniger Anstrengungen für den Ansatz zu unternehmen.Der größte Vorteil von innerHTML ist die Benutzererfahrung, die durch diese Funktion verbessert wird.
Besuche die von Edureka. Mithilfe der Schulung zur Webentwicklungszertifizierung erfahren Sie, wie Sie mit HTML5-, CSS3-, Twitter Bootstrap 3-, jQuery- und Google-APIs beeindruckende Websites erstellen und für Amazon Simple Storage Service (S3) bereitstellen.
Hast du eine Frage an uns? Bitte erwähnen Sie es im Kommentarbereich von 'String-Verkettung in JavaScript' und wir werden uns bei Ihnen melden.