<div class="wraper">
<div class="one">老大<p>pppp</p></div>
<div class="box">
<span>内容</span>
<a href="#">链接</a>
<p>段落</p>
<p>ll</p>
</div>
<div class="last">老弟</div>
</div>
var box = document.getElementsByClassName('box')[0];
console.dir(box);
var boxNode = box.nodeName;
console.log(boxNode);
var boxParent = box.parentNode;
console.log(boxParent,'---------------');
var boxParentEl = box.parentElement;
console.log(boxParentEl,'==============');
var boxChildren = box.children;
console.log(boxChildren);
var fd = boxChildren[0];
console.log(fd);
var childNodes = box.childNodes;
console.log(childNodes,'---------------------');
var ch = childNodes[0].nextElementSibling;
console.log(ch,'++++++++++++++++');
var pre = box.previousSibling;
console.log(pre);
var preEl = box.previousElementSibling;
console.log(preEl);
var next = box.nextSibling;
console.log(next);
var nextEl = box.nextElementSibling;
console.log(nextEl);
var first = box.firstChild;
console.log(first);
var firstEl = box.firstElementChild
console.log(firstEl);
var lastCh = box.lastChild;
console.log(lastCh);
var lastEl = box.lastElementChild;
console.log(lastEl);
var div = document.createElement('div');
box.appendChild(div);
box.removeChild(box.lastElementChild);
var h1 = document.createElement('h1');
var a = document.getElementsByTagName('a')[0];
box.replaceChild(h1,a);
var last = document.getElementsByClassName('last')[0];
var clone1 = last.cloneNode(true);
console.log(clone1);
var clone2 = last.cloneNode(false);
console.log(clone2);