Heim  >  Artikel  >  Web-Frontend  >  Javascript implementiert die Multiplikationstabelle

Javascript implementiert die Multiplikationstabelle

王林
王林Original
2023-05-09 18:08:08540Durchsuche

Die Multiplikationstabelle ist ein wichtiges Werkzeug für Anfänger, um die Grundlagen der Multiplikation zu erlernen, und es ist auch ein häufiges Projekt für Programmierer, um ihre Programmierkenntnisse zu üben. In diesem Artikel zeige ich Ihnen, wie Sie eine einfache Multiplikationstabelle mit JavaScript implementieren.

Zunächst müssen wir den Grundaufbau des Einmaleins klären. Das Einmaleins ist normalerweise eine quadratische Tabelle mit Zahlen von 1 bis 10. Jede Zeile und Spalte beginnt mit diesen Zahlen und füllt entsprechend ihrem Produkt das Raster der Tabelle.

Wir können verschachtelte Schleifen verwenden, um diese Tabelle zu generieren. Die äußere Schleife wird verwendet, um die Anzahl der Zeilen in der Tabelle zu steuern, und die innere Schleife wird verwendet, um Spalten in jeder Zeile zu generieren. Der spezifische Code lautet wie folgt:

for (let i = 1; i <= 10; i++) {
  let row = '';
  for (let j = 1; j <= 10; j++) {
    row += (i * j) + '    ';
  }
  console.log(row);
}

In diesem Code verwenden wir zunächst eine äußere Schleife, um die Anzahl der Zeilen in der Tabelle zu steuern, wobei wir eine Schleife von 1 bis 10 durchlaufen. Wir verwenden die innere Schleife, um jedes Mal eine Zeile zu generieren, wenn die äußere Schleife einmal ausgeführt wird.

Die innere Schleife durchläuft eine Schleife von 1 bis 10. Bei jeder Ausführung wird die aktuelle Anzahl von Zeilen und Spalten multipliziert und das Ergebnis zur Zeichenfolge dieser Zeile hinzugefügt. Hier haben wir Vorlagenzeichenfolgen aus ES6 verwendet, um die Zeichenfolge zu erstellen, sodass das Ergebnis mithilfe des Zeichens vom nächsten Ergebnis getrennt werden kann.

Abschließend verwenden wir die Funktion console.log(), um jede Zeile an die Konsole auszugeben.

Wenn Sie die Ergebnisse in eine HTML-Seite drucken möchten, können Sie diesen Code leicht ändern. Konkret können Sie die Funktion document.createElement() verwenden, um ein Tabellenelement auf der Seite zu erstellen, und dann das innerHTML-Attribut verwenden, um jede Zeile zur Tabelle hinzuzufügen. Der Code lautet wie folgt:

const table = document.createElement('table');
for (let i = 1; i <= 10; i++) {
  let row = '<tr>';
  for (let j = 1; j <= 10; j++) {
    row += '<td>' + (i * j) + '</td>';
  }
  row += '</tr>';
  table.innerHTML += row;
}
document.body.appendChild(table);

In diesem Code verwenden wir die Funktion document.createElement(), um ein Tabellenelement namens table zu erstellen. In der äußeren Schleife erstellen wir jede Zeile als HTML-Element a34de1251f0d9fe1e645927f19a896e8 und verwenden die innere Schleife, um b6c5a531a458a2e790c1fd6421739d1c-Elemente zu generieren, wobei wir jedes Produkt als Inhalt der Zelle verwenden.

Schließlich fügen wir diese HTML-Elemente dem Body-Element hinzu, um es zu einem Teil des Dokuments zu machen.

Zusammenfassend haben wir in diesem Artikel eine einfache Multiplikationstabelle mit JavaScript erstellt. Ob Ausgabe in der Konsole oder Generierung auf einer Webseite, dies ist ein bewährtes Übungsprojekt. Gleichzeitig haben wir auch gelernt, wie man mithilfe verschachtelter Schleifen komplexe Datenstrukturen generiert.

Das obige ist der detaillierte Inhalt vonJavascript implementiert die Multiplikationstabelle. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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