web前端开发工程师项目经验，[JavaScript实例解析]简易TODO List，超通俗解析

display: table;

clear: both;

}

input {

border: none;/清除默认边框样式/

width: 75%;/宽度为父级的75%/

padding: 10px;/内边距/

float: left;/左浮动/

font-size: 16px;/字体大小/

}

.addBtn {/定义添加按钮样式/

padding: 9px;

width: 25%;

background: #d9d9d9;

color: #555;

float: left;

text-align: center;

font-size: 16px;

cursor: pointer;/鼠标变成手/

transition: 0.3s;

}

.addBtn:hover {

background-color: #bbb;/鼠标移上时/

}

JavaScript：

// Create a “close” button and append it to each list item

var myNodelist = document.getElementsByTagName(“LI”);

var i;

for (i = 0; i < myNodelist.length; i++) {

var span = document.createElement(“SPAN”);

var txt = document.createTextNode(“\u00D7”);

span.className = “close”;

span.appendChild(txt);

myNodelist[i].appendChild(span);

}

// Click on a close button to hide the current list item

var close = document.getElementsByClassName(“close”);

var i;

for (i = 0; i < close.length; i++) {

close[i].onclick = function() {

var div = this.parentElement;

div.style.display = “none”;

}

}

// Add a “checked” symbol when clicking on a list item

var list = document.querySel