Maison  >  Article  >  interface Web  >  Javascript implémente la table de multiplication

Javascript implémente la table de multiplication

王林
王林original
2023-05-09 18:08:08540parcourir

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);
}

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);

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 a34de1251f0d9fe1e645927f19a896e8 et utilisons la boucle interne pour générer des éléments b6c5a531a458a2e790c1fd6421739d1c, 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!

Déclaration:
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