用JS and DOM生成表格

修复JS创建表格错误

最新推荐文章于 2022-06-06 16:56:18 发布

最新推荐文章于 2022-06-06 16:56:18 发布 · 215 阅读

文章标签：

#Firefox #JavaScript #J# #浏览器 #ViewUI

js 专栏收录该内容

4 篇文章

订阅专栏

本文介绍了一种使用JavaScript动态创建HTML表格的方法，并解决了在获取body元素时出现的错误。通过理解getElementsByTagName方法返回值的特点，成功地实现了表格的创建。

<script language="javascript">
     function start(){
       mybody = document.getElementsByTagName  ("body").item(0);
        mytable = document.createElement("TABLE");
        mytablebody = document.createElement("TBODY");
        for(j=0;j<2;j++){
           mycurrent_row = document.createElement("TR");
           for(i=0;i<2;i++){
               mycurrent_cell= document.createElement("TD");
              currenttext=document.createTextNode("cell is  row "+j+",  column "+i);
              mycurrent_cell.appendChild(currenttext);
              mycurrent_row.appendChild(mycurrent_cell);
           }
           mytablebody.appendChild(mycurrent_row);
       }
       mytable.appendChild(mytablebody);
       mybody.appendChild(mytable);
       mytable.setAttribute("border","2");
   }
  </script>

原来mybody = document.getElementsByTagName ("body").item(0);是mybody = document.getElementsByTagName ("body");写的，报错“对象不支持属性或方法”后来发现getElementsByTagName（）方法返回一个集合，所以改成代码中的写法通过。很不好找呀