Maison  >  Article  >  interface Web  >  Comment implémenter la table de multiplication 99 en javascript

Comment implémenter la table de multiplication 99 en javascript

青灯夜游
青灯夜游original
2021-09-06 16:21:0720554parcourir

En JS, vous pouvez implémenter la table de multiplication 99 en imbriquant deux niveaux de boucles for. Le format de syntaxe est "for(var i=1;i

Comment implémenter la table de multiplication 99 en javascript

L'environnement d'exploitation de ce tutoriel : système Windows 7, JavaScript version 1.8.5, ordinateur Dell G3.

Javascript implémente 99 tables de multiplication

Tout d'abord, regardons la table de multiplication 99

Comment implémenter la table de multiplication 99 en javascript

et nous pouvons obtenir le modèle du graphique :

  • Il y a 9 lignes et 9 colonnes au total , et il y a autant de lignes qu’il y a de lignes dans une expression.

  • Dans la ligne i, l'expression commence à i*1 et se termine à i*i. Il y a un total de i expressions (nous pouvons obtenir cet effet grâce à une boucle).

Par conséquent, une double boucle est nécessaire pour contrôler la sortie. La boucle externe contrôle le nombre de lignes i (i est au minimum 1 et le maximum est 9), et la boucle interne contrôle la colonne j (j est au minimum 1 et le maximum est égal à i).

Code d'implémentation :

for(var i = 1; i <= 9; i++){     //外层循环控制行
	for(var j = 1; j <= i; j++) //内层循环控制列
	{
		document.write(j+"*"+i+"="+j*i+"   ");
	}
	document.write("</br>");
}

Résultat de sortie :

Comment implémenter la table de multiplication 99 en javascript

Nous pouvons également mettre la table de multiplication 99 dans un tableau et la sortir comme l'image du début :

document.write("<table>");

for (var i = 1; i <= 9; i++) { //外层循环控制行
	document.write("<tr>");
	for (var j = 1; j <= i; j++) //内层循环控制列
	{
		document.write("<td>" + j + "*" + i + "=" + j * i + "</td>");
	}
	//换行,控制每行的输出几个表达式
	document.write("</tr>");
}
document.write("</table>");

Ajoutez ensuite le style CSS pour la modifier :

table {
	width: 600px;
	border-collapse: separate;
}

table td {
	border: #000 1px solid;
	text-align: center;
}

Regardez les résultats de sortie :

Comment implémenter la table de multiplication 99 en javascript

[Apprentissage recommandé : Tutoriel avancé javascript]

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