Beginner JS new Node creation Delete Step _javascript tips

I envy the senior programmer who wrote these special effects. I want to learn, but always do not know how to think, do not know how to logic. Sometimes also very anxious, these are not afraid, fortunately someone taught me, pointing me, this is my more fortunate. But I can not pass this off, their biggest drawback is to escape, will not do to give up, will not be no, and dare not ask. Change, this big flaw must change. Below, is the Yang elder brother to instruct my study skill, the thought is clear, the efficiency also has the very big enhancement. The nonsense is not to pull, to the following:
Title: Btton button to add a delete, click the Add button will add a node, click the Delete button will delete the last node, add a new element click will be deleted.
Step One: Analysis of ideas to prepare work (structure behavior performance separation is HTML structure JS script CSS style separation)
First: Build HTML structure, define CSS style, write basic script (because JS script is separate from HTML structure).

Copy Code code as follows:

<div class= "Btns" >
<input type= "button" value= "Add" id= "addbtn" ></input>
<input type= "button" value= "Remove" id= "removebtn" ></input>
</div>
<div class= "box" id= "Boxcon" ></div>

JS Analysis: First two button of the OnClick event, followed by the addition and deletion are encapsulated into a method in order to invoke the function, to achieve the purpose of reuse.

Copy Code code as follows:

Window.onload = function () {
Addbtn.onclick = function () {}
Removebtn.onclick = function () {}
}

Step Two: Write a method created: Create a new node

Copy Code code as follows:

function Createele () {
var Newele = document.createelement ("div");//define a new element node variable
var newbtn = document.createelement ("input");//define a new element node variable
var Boxele = document.getElementById ("Boxcon");
Finding the element that you want to add to is both the upper level element and the ID identifier to find
Newele.classname= "con"; attribute style given new element write in CSS
Newbtn.type = "button";
Newbtn.value = "Remove";
Boxele.appendchild (Newele)//Add new node to Boxcon
}

Step Three: Write Delete method: delete element.

Copy Code code as follows:

function Removeele (removeobj) {
RemoveObj.parentNode.removeChild (Removeobj);
Delete Element
}

Step four: Call the function

Copy Code code as follows:

Window.onload = function () {
Addbtn.onclick = function () {
Createele ();
}
Removebtn.onclick = function () {
var box = document.getElementById ("Boxcon");
Removeele (Box.lastchild);
}
}

Oh, finally finished the almost, don't worry there is a function. One last feature. (The new element added will be deleted when clicked)
Over the ... Oh, I still don't quite understand the usage of this one ... After that, we need to study carefully ...