JS implementation of printing multiplication table method example-JS Tutorial-php.cn

JS implementation of printing multiplication table method example

小云云

Release： 2018-03-13 15:48:08

Original

3753 people have browsed it

This article mainly shares with you an example of how to print the multiplication table using JS. I hope it can help you.

Steps

1. Loop first and spell out the entire multiplication table

2. Put the multiplication table into a table

3. Simply add some style to the table

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>JS打印九九乘法表</title>
    <style media="screen">
      /* 简单给整个table加点样式 */
      table{
        border-collapse: collapse;
      }
      table tr{
        border: 1px solid #666;
      }
      table tr th{
        border: 1px solid #666;
        color: #999;
        padding:10px;
      }
    </style>
  </head>
  <body>
    <script type="text/javascript">
    // 创建table
    document.write("<table>");
      // 打印九九乘法表
      for(var x = 1;x <= 9;x++){
        // 创建tr
        document.write("<tr>");
        for(var y = 1;y <= x;y++){
          // 公式里创建th
          document.write(&#39;<th>&#39; + x + &#39;*&#39; + y + &#39;=&#39; + (x * y) + &#39;</th>&#39;)
        }
        // 闭合tr
        document.write("</tr>");
      }
    // 闭合table
    document.write("</table>")
    </script>
  </body>
</html>

Copy after login

Related recommendations:

An example of using double-layer loop to implement the multiplication table

js implements the exquisite multiplication table effect code

JS implements the up, down, left and right symmetrical multiplication table_javascript skills

The above is the detailed content of JS implementation of printing multiplication table method example. For more information, please follow other related articles on the PHP Chinese website!