13

动态创建表格

var json='[{"ename":"Tom", "salary":10000, "age":25},{"ename":"John", "salary":11000, "age":28},{"ename":"Mary", "salary":12000, "age":25}]';

                var emps=eval(json);

                var table=document.createElement('table');

                var thead=document.createElement('thead');

                var tr=document.createElement('tr');

                for(var key in emps[0]){

                var th=document.createElement('th');

                th.innerHTML=key;

                tr.appendChild(th);

                }

                thead.appendChild(tr);

                table.appendChild(thead);

                //创建tbody

                var tbody=document.createElement('tbody');

                for(var i=0;i

                    //创建行

                    var tr=document.createElement('tr');

                    tbody.appendChild(tr);

                    //创建td

                    for(var key in emps[i]){

                        var td=document.createElement('td');

                        td.innerHTML=emps[i][key];

                        tr.appendChild(td);

                    }

                }

                  table.appendChild(tbody);

                document.getElementById('data').appendChild(table);

仿微博

var inputVal=document.querySelector('.content>input');

            console.log(inputVal);

            var qwe=/^\s+$/;

            //获取button

            var btn=document.querySelector('.content>button');

            btn.onclick=function(){

                if(inputVal.value==''||qwe.test(inputVal.value)){

                }else{

                //动态创建元素：

                var div=document.createElement('div');

                div.className='main';

                var img=document.createElement('img');

                img.src='img/1.jpg';

                div.appendChild(img);

                var p=document.createElement('p');

                p.innerHTML=inputVal.value;

                div.appendChild(p);

                var button=document.createElement('button');

                button.innerHTML='删除';

                div.appendChild(button);

                document.querySelector('.container').appendChild(div);

                    button.onclick=function(){

                    this.parentElement.parentElement.removeChild(this.parentElement);

                }

            }

            }