码迷,mamicode.com
首页 > Web开发 > 详细

JS Dom节点操作demo!

时间:2017-04-13 14:41:32      阅读:198      评论:0      收藏:0      [点我收藏+]

标签:class   课程   function   turn   create   表格   span   i++   ble   

通过黑马课程的学习,在这里分享一个js Dom中节点操作的小练习

需求:使用js创建一个4*3的表格table.

onload = function(){
        function c(tagName){
            return document.createElement(tagName);
        }
        var table = c(‘table‘);
        var tbody = c(‘tbody‘);
        table.appendChild(tbody);
        for(var i = 0;i<4;i++){
            var tr = c(‘tr‘);
            for(var j = 0;j<3;j++){
                var td = c(‘td‘);
                //在td中放置文本
                var txt = document.createTextNode(‘‘);
                td.appendChild(txt);
                tr.appendChild(td);
                td.width = 200;
                td.height = 50;
            }
            tbody.appendChild(tr);
        }
        table.setAttribute(‘border‘,‘1‘);
        document.body.appendChild(table);
    };

 

JS Dom节点操作demo!

标签:class   课程   function   turn   create   表格   span   i++   ble   

原文地址:http://www.cnblogs.com/wccc/p/6703388.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!