三行代码实现九九乘法表~

这是一张九九乘法表~做到如上图所示,基本结构只需三行代码即可实现~

一.此时需引入js基础学习到的第一门编程语言---JavaScript~

二.观察九九乘法表不难得出以下规律:

1.每块区域都是 a * b = c 的结构,

2.行数号与列数相等(划重点!!!)

三.基于此,我们可以联想到js基础引入的一个很重要的概念,循环~~~(这可是个好登西!)

试想,忽视小块里(a * b = c)的内容,怎么用js生成以上结构呢?

把小块换成♥,在页面输出如下所示怎么完成呢?

重点来啦!!! 仔细观察,第1行有1个爱心,第2行有2个,第3行3个...依此类推,第9行有9个...

那我们是不是可以理解为,循环第一次,生成1个爱心,循环第二次,生成2个,第三次3个...

那么怎么实现呢??

单次循环肯定无法实现,那在循环里面再嵌套一个循环呢,让内部循环的条件与外部循环关联~

<script>for (let i = 1; i <= 9; i++) {document.write('<br>')for (let j = 1; j <= i; j++) {document.write('♥')}}</script>

外层i打印行,里层j打印列,让里层条件j < = i ,即当 i = 1时, j = 1 满足j < = i的条件,执行打印爱心代码,当 i++自增为2时, j = 1执行一次, j++自增为2时,也满足j < = i的条件,再执行一次,依此类推,当 i = 9时,里层代码执行9次..即外层循环一次,里层循环了九次~

九九乘法表也是如此~

把爱心换成 a * b = c 的结构, 继续寻找规律可以得出,a的值为列数,b的值为行数
如 : 第三行:1 * 3 = 3 , 2 * 3 = 6 , 3 * 3 = 9, 标记蓝色的3是九九乘法的行数3,未标记的则为一次递增的1,2,3列...

基于此,只需要把爱心的案例这一行document.write('♥') ,改为j * i 的乘积!!

    <script>for(let i = 1;i<=9;i++){document.write('<br>')for(let j = 1;j<=i;j++){                document.write(`${j}X${i}=${j*i}`)             }}</script>

如图:

芜湖~~只需三行代码,即实现了九九乘法表~~~(ps:换行不算嗷hh)

再给咱们乘法表美化下,就用咱们老本行CSS样式就好啦!

注意:给 js加样式,记得套标签哦,我这里就用span啦~

    <style>span {display: inline-block;width: 100px;height: 50px;background-color: rgb(181, 219, 147);border: 1px solid skyblue;text-align: center;line-height: 50px;margin: 3px;border-radius: 20px;}</style>
</head><body><script>for (let i = 1; i <= 9; i++) {document.write('<br>')for (let j = 1; j <= i; j++) {document.write(`<span>${j}X${i}=${j * i}</span>`)}}</script>
</body>

好啦! 这样就可以得到开篇的乘法表咯~~~

三行代码实现九九乘法表~相关推荐

python上三角九九乘法表_用5行Python代码打印九九乘法表
今天来个小练习,用 5 行 python 代码打印九九乘法表. 分析问题九九乘法表是有一定的规律,每一行的等式里面,第一位数从 1 开始递增,第二位数保持不变,每一列的等式里面,第一位为当前的列数, ...
用java代码实现九九乘法表
分析乘法表发现,整体有九行,第一行是一列,第二行是两列,第三行三列.....第九行对应有九列,所以它的行数对应就有多少列,这样我们可以通过借助行数来控制它的列数,以此来实现乘法表的打印. 具体代码实现 ...
用代码输出九九乘法表
使用for循环输出九九乘法表,代码如下: package lianxi; public class chengfabiao { public static void main(String[] ...
java代码实现九九乘法表
使用双重for循环实现九九乘法表 public static void main(String[] args){System.out.println("=================== ...
JavaScript代码实现九九乘法表
以三角的形式打印出九九乘法表 : <!DOCTYPE html> <html lang="en"> <head><meta charset ...
九九乘法表c语言代码空格,九九乘法表的C语言代码.doc
int main() { int i=1,j; for (i=1,j=1;j<=9;j++) { if( j==1) printf("%d*%d=%d\n",i,j,i*j) ...
python一行代码实现99乘法表_一行代码实现九九乘法表
#第一种来一个普通的 for m in range(1,10):for n in range(1,m+1):print("%d * %d = %d" %(m,n,m*n),end= ...
如何用python制作九九乘法表_Python一行代码给儿子制作九九乘法表
一行代码实现九九乘法表 print('\n'.join(' '.join(['%sX%s=%s'%(j,i,i*j) for j in range(1,i+1)]) for i in range(1, ...
Python一行代码给儿子制作九九乘法表
一行代码实现九九乘法表print('\n'.join(' '.join(['%sX%s=%s'%(j,i,i*j) for j in range(1,i+1)]) for i in range(1,1 ...

三行代码实现九九乘法表~

三行代码实现九九乘法表~相关推荐

最新文章

热门文章