JavaScript----DOM增删改

今天小王又来学习了......

函数的封装真好用啊，写的时候有点绕，但用起来太爽了吧嘻嘻

看了一个前端的面试，视频中是培训班包装出来的学员，三年工作经验，一问三不知，或者是答非所问...隔着屏幕都能感受到的尴尬气氛。

一定要努力呀，虽然不知道自己适不适合，但都要尽自己最大的努力，冲鸭！！

window.onload = function(){
            function myClick(idStr,fun){
                var btn = document.getElementById(idStr);
                btn.onclick = fun;
                
            }
            myClick("btn01",function(){
                //创建一个“广州”节点，添加到#city下  <li>广州</li>
                var li = document.createElement("li");
                var gzText = document.createTextNode("广州");
                li.appendChild(gzText);
                var city = document.getElementById("city");
                city.appendChild(li);
            

            });
            myClick("btn02",function(){
                //将“广州”节点插入到#bj前面
                var li = document.createElement("li");
                var gzText = document.createTextNode("广州");
                li.appendChild(gzText);
                var bj = document.getElementById("bj");
                var city = document.getElementById("city");
                city.insertBefore(li,bj);
                
            });
            
            myClick("btn03",function(){
                //使用“广州”节点替换#bj节点
                var li = document.createElement("li");
                var gzText = document.createTextNode("广州");
                li.appendChild(gzText);
                var bj = document.getElementById("bj");
                var city = document.getElementById("city");
                city.replaceChild(li,bj);
            });
            
            myClick("btn04",function(){
                //删除#bj节点
                var bj = document.getElementById("bj");
                bj.parentNode.removeChild(bj);
            });
            
            myClick("btn05",function(){
                //读取#city内的HTML代码
                var city = document.getElementById("city");
                alert(city.innerHTML);
            });
            
            myClick("btn06",function(){
            //设置#bj内的HTML代码
            var bj = document.getElementById("bj");
            bj.innerHTML = "昌平";
            });
            
            myClick("btn07",function(){
                //结合innerHTML创建一个“广州”节点，添加到#city下
                var li = document.createElement("li");
                li.innerHTML = "广州";
                var city = document.getElementById("city");
                city.appendChild(li);
            });
            
            
        };