Javascript implémente la table de multiplication

王林
Libérer: 2023-05-09 18:08:08
original
572 Les gens l'ont consulté

La table de multiplication est un outil important permettant aux débutants d'apprendre les bases de la multiplication, et c'est également un projet courant permettant aux programmeurs de mettre en pratique leurs compétences en programmation. Dans cet article, je vais vous montrer comment implémenter une table de multiplication simple à l'aide de JavaScript.

Tout d’abord, nous devons clarifier la structure de base de la table de multiplication. La table de multiplication est généralement une table carrée contenant des nombres de 1 à 10. Chaque ligne et colonne commence par ces nombres et remplit la grille du tableau en fonction de leur produit.

Nous pouvons utiliser des boucles imbriquées pour générer ce tableau. La boucle externe est utilisée pour contrôler le nombre de lignes dans le tableau et la boucle interne est utilisée pour générer des colonnes dans chaque ligne. Le code spécifique est le suivant :

for (let i = 1; i <= 10; i++) {
  let row = '';
  for (let j = 1; j <= 10; j++) {
    row += (i * j) + '    ';
  }
  console.log(row);
}
Copier après la connexion

Dans ce code, nous utilisons d'abord une boucle externe pour contrôler le nombre de lignes dans le tableau, en boucle de 1 à 10. Nous utilisons la boucle interne pour générer une ligne à chaque fois que la boucle externe s'exécute une fois.

La boucle interne boucle de 1 à 10. Chaque fois qu'elle est exécutée, le nombre actuel de lignes et de colonnes est multiplié et le résultat est ajouté à la chaîne de cette ligne. Ici, nous avons utilisé des chaînes modèles d'ES6 pour construire la chaîne, afin que le résultat puisse être séparé du résultat suivant à l'aide du caractère.

Enfin, nous utilisons la fonction console.log() pour afficher chaque ligne sur la console.

Si vous souhaitez imprimer les résultats dans une page HTML, vous pouvez modifier légèrement ce code. Plus précisément, vous pouvez utiliser la fonction document.createElement() pour créer un élément de tableau dans la page, puis utiliser l'attribut innerHTML pour ajouter chaque ligne au tableau. Le code est le suivant :

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);
Copier après la connexion

Dans ce code, nous utilisons la fonction document.createElement() pour créer un élément de table nommé table. Dans la boucle externe, nous construisons chaque ligne comme un élément HTML et utilisons la boucle interne pour générer des éléments , en prenant chaque produit comme contenu de la cellule.

Enfin, nous ajoutons ces éléments HTML à l'élément body pour l'intégrer au document.

Pour résumer, dans cet article, nous avons généré une simple table de multiplication en utilisant JavaScript. Qu'il s'agisse d'une sortie dans la console ou d'une génération dans une page Web, il s'agit d'un projet de bonne pratique. Parallèlement, nous avons également appris à utiliser des boucles imbriquées pour générer des structures de données complexes.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal