Chrome 断点调试运行成功了

—

by

FeanLau
in

Chrome 可以断点调试一步一步的去执行程序，知道每一步执行了哪些语句，做了一些什么事情的，这是非常方便开发的。

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Document</title>
  </head>
<body>
  <script>
  for(var r=0;r<=9;r++){
    for(var i=1,str="";i<=r;i++){
      str+=i+"x"+r+"="+i*r+" ";
    }
    console.log(str);
  }
  var tab = document.createElement('TABLE');
  tab.style.border = '1px solid black';
  tab.style.borderCollapse='collapse';
  for(var i = 1; i <=9 ; i++){
    var tr = document.createElement('TR');
    tab.appendChild(tr);
    for(var j = 1,str=""; j<=i ; j++){
      str=j+"x"+i+"="+i*j+" ";
      var td = document.createElement('TD');
      td.style.border = '1px solid black';
      td.style.height = '20px';
      td.innerHTML=str;
      tr.appendChild(td);
    }
  }
  document.body.appendChild(tab);

  </script> 
</body>
</html>

显示的界面如下，按 F10 快捷键，一步一步的执行程序，太爽了！！