Heim > Artikel > Web-Frontend > Beispiel für die Funktionsweise von „text+="“" in JavaScript

Beispiel für die Funktionsweise von „text+="“" in JavaScript

WBOYnach vorne: 2023-09-06 11:21:111194Durchsuche

JavaScript 中“text+=

In diesem Tutorial besprechen wir, warum Sie den Indikator „text += „“ in Javascript verwenden müssen.

Die Anweisung hier besteht darin, einer Variablen einen Codeabschnitt zuzuweisen. Die Variable hier ist „text“, „+“ ist der Zeichenfolgenverkettungsoperator, „=“ ist der Zuweisungsoperator, „“ enthält eine Codezeile und „““ enthält die hinzuzufügende Zeichenfolge.

Programmierer müssen lange Codeblöcke schreiben, z. B. HTML-Blöcke anhängen, Zeichenfolgen anhängen usw. Die Variable speichert alle Werte nacheinander und zeigt die gesamten Daten im Dom an. Vermeiden Sie einfache Anführungszeichen im Inhalt.

In JavaScript wird der Operator += verwendet, um einer Variablen einen Wert hinzuzufügen. Der Wert auf der rechten Seite des +=-Operators wird zur Variablen auf der linken Seite addiert und das Ergebnis wird in der Variablen gespeichert.

Hier sind einige Beispiele für die Verwendung von Text += "" in JavaScript -

let text = "Hello";
text += ""; // text is now "Hello"

let num = 1;
num += 1; // num is now 2

let arr = [1, 2, 3];
arr += [4, 5, 6]; // arr is now [1, 2, 3, 4, 5, 6]

Im ersten Beispiel wird der Operator += verwendet, um eine leere Zeichenfolge mit einer Textvariablen zu verketten. Dadurch wird der Wert der Textvariablen nicht geändert, da die leere Zeichenfolge keine Zeichen enthält.

Im zweiten Beispiel wird der Operator += verwendet, um die Variable „num“ um 1 zu erhöhen. Dadurch wird der Wert von num um 1 erhöht.

Im dritten Beispiel wird der Operator += verwendet, um zwei Arrays zu verketten. Dadurch werden die Elemente beider Arrays zu einem einzigen Array zusammengefasst.

Der Zweck des Indikators 'text +=" " ' in Javascript

Grammatik 1

var dataStr = 'content 1';
dataStr += 'content 2'+'content 3';
document.getElementById('id').innerHTML = dataStr;

Die obige Syntax weist verkettete Daten innerHTML zu.

Beispiel 1

In diesem Programm speichert die Variable „htmlStr“ den HTML-Codeblock und weist ihn dieser Variablen zu, um innerHTML festzulegen. Nach dem ersten HTML-Block gibt es ein Semikolon, um den Block zu beenden. Das Programm verwendet den Verkettungsoperator und den Zuweisungsoperator, um den verbleibenden Codeblock an das Ende des Codes anzuhängen.

<html>
<body>
   <h2> Javascript program that illustrates <i>variable += 'content' </i> </h2>
   <div id="htmlWrap"> </div>
   <script>
      
      //Save HTML code block in a variable
      var htmlStr = '<div class="div1">';
      htmlStr += '<h3>H3 tag</h1>' + '<p>P tag</p>' +
         '<strong>Escaping quotes' to avoid syntax error</strong>' +
         '</div>';
      
      //Set the code block to wrapper dom
      document.getElementById("htmlWrap").innerHTML = htmlStr;
   </script>
</body>
</html>

Grammatik 2

var dataStr = 'content';
document.getElementId('id').innerHTML += dataStr;

Die obige Syntax verkettet die Daten und weist sie innerHTML selbst zu.

Beispiel 2

Alternativ können Sie mehrere Zeilen direkt in innerHTML hinzufügen. Schauen Sie sich den Code unten an. Das Schreiben von innerHTML += 'content' reicht aus.

<html>
<body>
   <h2>Javascript program that illustrates <i>innerHTML += 'content'</i></h2>
   <div id="wrap">
      <p> A default text. </p>
   </div>
   <button onclick="moreData();">Add More</button>
   <script>
      function moreData() {
         document.getElementById("wrap").innerHTML +=
            "<h3>This is the text by user.</h3>";
      }
   </script>
</body>
</html>

Fazit

Dieses Tutorial informiert uns über die Notwendigkeit der Verkettung und Zuweisung bei mehreren Codezeilen in Javascript. Dieser Ansatz stellt sicher, dass der Code sauber und wiederverwendbar ist. Diese Schreibweise ist hilfreich, wenn Sie denselben HTML-Inhalt an mehreren Stellen auf einer Webseite benötigen. Außerdem wird die Möglichkeit von Syntaxformatierungsfehlern vermieden, wenn Sie längeren Code in einer einzigen Zeile schreiben.

Wir haben zwei Möglichkeiten gesehen, dies zu tun. Jeder kann eine Methode entsprechend seinen eigenen Programmanforderungen wählen.

Das obige ist der detaillierte Inhalt vonBeispiel für die Funktionsweise von „text+="“" in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

Dieser Artikel ist reproduziert unter:tutorialspoint.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen

Vorheriger Artikel：JavaScript-Programm zum Drucken aller AP-bildenden Tripel in einem sortierten ArrayNächster Artikel：JavaScript-Programm zum Drucken aller AP-bildenden Tripel in einem sortierten Array

In Verbindung stehende Artikel

Mehr sehen