<!
DOCTYPE
html>
<
html
>
<
head
>
<
title
>adduser.html</
title
>
<
meta
http-equiv
=
"keywords"
content
=
"keyword1,keyword2,keyword3"
>
<
meta
http-equiv
=
"description"
content
=
"this is my page"
>
<
meta
http-equiv
=
"content-type"
content
=
"text/html; charset=UTF-8"
>
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<
script
type
=
"text/javascript"
src
=
"../js/append1.js"
></
script
>
</
head
>
<
body
>
<
div
align
=
"center"
>
<
div
>添加联系人</
div
>
<
input
type
=
"text"
name
=
"name"
>姓名<
br
/>
<
input
type
=
"text"
name
=
"phone"
>电话<
br
/>
<
input
type
=
"text"
name
=
"mail"
>邮箱<
br
/>
<
input
type
=
"button"
onclick
=
"add()"
value
=
"提交"
>
</
div
>
<
hr
>
<
div
align
=
"center"
>
<
table
border
=
"1"
cellspacing
=
"0"
id
=
"table"
>
<
tr
id
=
"Button"
>
<
td
colspan
=
"4"
align
=
"center"
>
<
input
type
=
"button"
value
=
"全选"
onclick
=
All
()>
<
input
type
=
"button"
value
=
"反选"
onclick
=
other
()>
<
input
type
=
"button"
value
=
"删除"
onclick
=
Delete
()>
</
td
>
</
tr
>
<
tr
>
<
td
><
input
name
=
"items"
type
=
"checkbox"
></
td
>
<
td
>李四</
td
>
<
td
>1361888234</
td
>
<
td
>ab@sina.com</
td
>
</
tr
>
</
table
>
</
div
>
</
body
>
</
html
>
|
function
add(){
var
Node_name=document.getElementsByName(
"name"
)[0];
var
Node_phone=document.getElementsByName(
"phone"
)[0];
var
Node_mail=document.getElementsByName(
"mail"
)[0];
var
Element_tr=document.createElement(
"tr"
);
var
select_td=document.createElement(
"td"
);
var
input_node=document.createElement(
"input"
);
input_node.setAttribute(
"name"
,
"items"
);
input_node.setAttribute(
"type"
,
"checkbox"
);
select_td.appendChild(input_node);
var
name_td=document.createElement(
"td"
);
var
name_text=document.createTextNode(Node_name.value);
name_td.appendChild(name_text);
var
phone_td=document.createElement(
"td"
);
var
phone_text=document.createTextNode(Node_phone.value);
phone_td.appendChild(phone_text);
var
mail_td=document.createElement(
"td"
);
var
mail_text=document.createTextNode(Node_mail.value);
mail_td.appendChild(mail_text);
Element_tr.appendChild(select_td);
Element_tr.appendChild(name_td);
Element_tr.appendChild(phone_td);
Element_tr.appendChild(mail_td);
var
Element_table=document.getElementById(
"table"
);
Element_table.appendChild(Element_tr);
}
function
All(){
var
check_node=document.getElementsByName(
"items"
);
for
(
var
i = 0; i < check_node.length; i++) {
check_node[i].checked=
"checked"
;
}
}
function
other(){
var
check_node=document.getElementsByName(
"items"
);
for
(
var
i = 0; i < check_node.length; i++) {
if
(check_node[i].checked){
check_node[i].checked=
null
;
}
else
{
check_node[i].checked=
"checked"
;
}
}
}
function
Delete(){
var
check_node=document.getElementsByName(
"items"
);
//alert(check_node.length);
for
(
var
i = 0; i < check_node.length; i++) {
if
(check_node[i].checked){
//alert(check_node[i].checked);
var
delete_tr_node=check_node[i].parentNode.parentNode;
//alert(delete_tr_node.nodeName);
var
Element_table=document.getElementById(
"table"
);
Element_table.removeChild(delete_tr_node);
}
}
}
For循环颠倒一下就可以了,现在循环是从小到大,改成从大到小就可以了,因为
数组长度在变化