近日在群里看到有个题目，拿出来写写，@H_404_1@

要求：@H_404_1@

用html,css,原生js实现如图的效果，先正向输出，然后逆向回溯，最后停留在完整的画面。@H_404_1@

@H_404_1@@H_404_1@

首先：

HTML部分代码：

@H_404_1@

就是这么简单一行搞定。@H_404_1@

CSS代码：

CSS代码也很简单，span中的margin主要就是为了消除出现双border的问题。@H_404_1@

接下来重点来了@H_404_1@

javascript代码：

首先创建一个9*9乘法表的函数@H_404_1@

1，新建一个用来放HTML代码片段的空数组：@H_404_1@

2，使用for循环遍历出9*9乘法表格：@H_404_1@

3，将循环内容push进之前新建的空数组：@H_404_1@

4，注意为了实现阶梯在j循环完毕之后添加一个换行字符：@H_404_1@

5，最后记得return出刚刚那个数组：@H_404_1@

创建9*9乘法表的函数就完成了。@H_404_1@

接下来是将展示到页面中：@H_404_1@

我们依然是创建一个新的函数:inHTML()@H_404_1@

1，首先声明一些初始化变量@H_404_1@

2，接着我们创建一个定时器，让数据依次展示：@H_404_1@

<div class="jb51code">
<pre class="brush:js;">
timer = setInterval(function(){
//内容
},100)