式1
シンプルな回答<script>
//初期値
const xStart = 1, yStart = 1;
const xEnd = 9, yEnd = 9;
//処理
const maxLen = String(xEnd*yEnd).length;
let output = "";
for(let x = xStart; x <= xEnd; x++){
for(let y = yStart; y <= yEnd; y++){
output += ".";
let nowLen = String(x*y).length;
if(maxLen > nowLen){
for(let i = nowLen; i < maxLen; i++){
output += "_";
}
}
output += x*y;
}
output += "<br>";
}
document.write(output);
</script>
出力1
._1._2._3._4._5._6._7._8._9
._2._4._6._8.10.12.14.16.18
._3._6._9.12.15.18.21.24.27
._4._8.12.16.20.24.28.32.36
._5.10.15.20.25.30.35.40.45
._6.12.18.24.30.36.42.48.54
._7.14.21.28.35.42.49.56.63
._8.16.24.32.40.48.56.64.72
._9.18.27.36.45.54.63.72.81
式2
色々付け加えた物<script>
//初期値
let [xStart,yStart] = [1,1];
let [xEnd,yEnd] = [9,9];
//処理
function numUse(num){
return Math.abs(Math.floor(num));
}
xStart = numUse(xStart),yStart = numUse(yStart);
xEnd = numUse(xEnd) ,yEnd = numUse(yEnd) ;
const maxLen = String(xEnd*yEnd).length;
let output = "";
function numAlign(maxL,nowL){
let returnTxt="";
if(maxL > nowL){
for(let i = nowL; i < maxL; i++){
returnTxt += "_";
}
}
return returnTxt;
}
for(let x = xStart; x <= xEnd; x++){
output += numAlign( String(xEnd).length, String(x).length );
output += x + "の段" + "|";
for(let y = yStart; y <= yEnd; y++){
if(y != yStart){output += ".";}
let nowLen = String(x * y).length;
output += numAlign(maxLen, nowLen);
output += x * y;
}
output += "<br>";
}
document.write(output);
</script>
出力2
1の段:_1._2._3._4._5._6._7._8._9
2の段:_2._4._6._8.10.12.14.16.18
3の段:_3._6._9.12.15.18.21.24.27
4の段:_4._8.12.16.20.24.28.32.36
5の段:_5.10.15.20.25.30.35.40.45
6の段:_6.12.18.24.30.36.42.48.54
7の段:_7.14.21.28.35.42.49.56.63
8の段:_8.16.24.32.40.48.56.64.72
9の段:_9.18.27.36.45.54.63.72.81