近日在群里看到有个题目,拿出来写写,
要求:
用html,css,原生js实现如图的效果,先正向输出,然后逆向回溯,最后停留在完整的画面。
首先:
HTML部分代码:
就是这么简单一行搞定。
CSS代码:
CSS代码也很简单,span中的margin主要就是为了消除出现双border的问题。
接下来重点来了
javascript代码:
首先创建一个9*9乘法表的函数
'+j+'*'+i+'='+(j*i)+'');
}
html.push('
'); } return html; }
'); } return html; }
1,新建一个用来放HTML代码片段的空数组:
2,使用for循环遍历出9*9乘法表格:
内容
}
}
3,将循环内容push进之前新建的空数组:
'+j+'*'+i+'='+(j*i)+'');
4,注意为了实现阶梯在j循环完毕之后添加一个换行字符:
');