Title
#electli{
width:100px;
height:20px;
background:#c4e3f3;
float:left;
list-style:none;
text-align:center;
margin-left:10px;
font-size:7px;
line-height:20px;
}
#listli{
width:100px;
height:20px;
background:#78c6e3;
list-style:none;
text-align:center;
margin-top:10px;
font-size:7px;
line-height:20px;
}
#list{
clear:both;
padding-top:10px;
text-align:center;
}
添加
刪除第一個
刪除最后一個
替換
//獲取對象
varlist=document.getElementById("list");
varapp=document.getElementById("app");
vardelF=document.getElementById("delF");
vardelL=document.getElementById("delL");
varupdate=document.getElementById("update");
//添加
app.onclick=function() {
//創建新標簽
varli=document.createElement("li");
//獲取li
varlist_li=list.getElementsByTagName("li");
//獲取li長度并賦值給變量num
varnum=list_li.length+1;
//創建新標簽的內容
vartext=document.createTextNode(num);
//將內容追加到新標簽里
li.appendChild(text);
//? ? ? ? 將標簽追加到ul里
list.appendChild(li);
//? ? ? ? li.innerHTML=list_li.length
//點擊刪除
for(vari=0;i
list_li[i].onclick=function() {
list.removeChild(this)
}
}
}
//刪除第一個
delF.onclick=function() {
list.removeChild(list.firstChild)
}
//刪除最后一個
delL.onclick=function() {
list.removeChild(list.lastChild)
}
//替換
update.onclick=function() {
varli=document.createElement("li");
vartext=document.createTextNode("哈哈哈");
//將內容追加到新標簽里
li.appendChild(text);
//? ? ? ? 將新的內容添加到li里 replaceChild(新元素,被替換的元素)
list.replaceChild(li,list.lastChild);
varlist_li=list.getElementsByTagName("li");
//? ? 點擊替換
//? ? for(var i=0;i
//? ? ? ? list_li[i].onclick=function () {
//? ? ? ? ? ? list.replaceChild(li,this)
//? ? ? ? }
//? ? }
}
