Heim > Web-Frontend > js-Tutorial > Hauptteil

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

WBOY
Freigeben: 2023-09-06 11:21:11
nach vorne
1218 Leute haben es durchsucht

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]
Nach dem Login kopieren

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;
Nach dem Login kopieren

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>
Nach dem Login kopieren

Grammatik 2

var dataStr = 'content';
document.getElementId('id').innerHTML += dataStr;
Nach dem Login kopieren

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>
Nach dem Login kopieren

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!

Quelle:tutorialspoint.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage