动态的9*9乘法表效果的实现代码

#result{
 width:550px;
 margin:30px auto;
 font-size:0;
 font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;
}
#result span{
 display:inline-block;
 width:60px;
 height:25px;
 line-height:25px;
 font-size:12px;
 text-align:center;
 border:1px solid #eee;
 margin: -1px 0 0 -1px;
}

function create(){
 var html = [];
 for(var i = 1;i <= 9;i++){
  for(var j = 1;j <= i;j++){
    html.push('<span>'+j+''+i+'='+(ji)+'</span>');
  }
   html.push('<br/>');
 }
 return html;
}

var html = [];

for(var i = 1;i <= 9;i++){
 for(var j = 1;j <= i;j++){
 //内容
 } 
}

html.push('<span>'+j+''+i+'='+(ji)+'</span>');

html.push('<br/>');

return html;

function inHTML(){
   var html = create(),
    i = 0,
    tmp = create(),
    timer = null,
    result = document.getElementById('result');
   timer = setInterval(function(){
    if(i > html.length){
     html.splice(html.length-1,1)
     result.innerHTML = html.join('');
    }
    else{
     result.innerHTML += html[i++];
    }
    if(!html.length){
     result.innerHTML = tmp.join('');
     clearInterval(timer);
    }
   },100)
  }

var html = create(),//调用之前创建的99函数
  i = 0,//初始化变量i
  tmp = create(),
  timer = null,//初始化
  result = document.getElementById('result');//获取id

timer = setInterval(function(){
 //内容 
},100)

if(i > html.length){ //判断i是否大于html.length，如果大于就逆向展示
 html.splice(html.length-1,1)
 result.innerHTML = html.join('');
}
else{ //如果小于就正向展示
 result.innerHTML += html[i++];
}
if(!html.length){ //判断如果html.length为false时展示。
 result.innerHTML = tmp.join('');
 clearInterval(timer);//清除定时器
}

inHTML();