function $(names){ //封裝獲取id元素
       return document.getElementById(names);
    }
    var box = $('box'); //傳參
    var sp = $('sp');
    var sps = $('sps');
    console.log(box.firstElementChild);//打印第一個(gè)子元素
    console.log(box.lastElementChild);//打印最后一個(gè)子元素
    console.log(box.childElementCount);//打印子元素的個(gè)數(shù)
    console.log(box.previousElementSibling);//打印前一個(gè)同輩元素
    console.log(box.children);//獲取元素子元素,返回一個(gè)數(shù)組
    console.log(sp.nextElementSibling);//打印下一個(gè)元素
    console.log(sps.previousSibling);//打印上一個(gè)節(jié)點(diǎn)
    sp.classList.add('nn');//為元素增加類名
    sp.classList.remove('aa');//為元素刪除類名
    console.log(sp.classList.contains('aa'));//檢測(cè)該類名是否存在，返回布爾值

2

var box = document.createElement('div');//創(chuàng)建一個(gè)新的div節(jié)點(diǎn)并取變量名
    var spa = document.createElement('span');//創(chuàng)建一個(gè)新的span節(jié)點(diǎn)并var變量名
    var newboxtext = document.createTextNode('hello world');//創(chuàng)建文本節(jié)點(diǎn)
    box.appendChild(newboxtext);//把文本節(jié)點(diǎn)插入div里
    box.classList.add('aa');//給div取一個(gè)class名
    // var boxnode = document.getElementsByClassName('aa')
    var wrap = document.getElementsByClassName('wrapper')[0];//獲取id名為wrapper的div并給變量名
    wrap.appendChild(box);//把變量名為box的div放到變量名為wrap的div里
    wrap.appendChild(spa);//同上
    var h1 = document.createElement('h1');//創(chuàng)建一個(gè)新的h1標(biāo)節(jié)點(diǎn)
    wrap.insertBefore(h1,box);//wrap為在什么地方插入；h1為想插入的元素；box為插入到這個(gè)元素前；
    var h2 = document.createElement('h2');
    wrap.replaceChild(h2,h1);//替換節(jié)點(diǎn)。h2為新節(jié)點(diǎn)，h1為要替換的節(jié)點(diǎn)；（簡(jiǎn)而言之：h1替換為h2）
    wrap.removeChild(spa);//刪除節(jié)點(diǎn)。該方法不是在刪除的節(jié)點(diǎn)上調(diào)用，而是在父節(jié)點(diǎn)上調(diào)用。
    var uls = document.getElementById('uls');//獲取ul節(jié)點(diǎn)
    var ss = uls.cloneNode(false);//克隆變量名為uls的元素；true為全部克??；false為只克隆這個(gè)元素
    wrap.appendChild(ss);//把克隆的元素插入到div里；