1.调用appendChild方法增加input对象,设置type属性的位置
2.appendChild一个radio对象,设置该对象的name属性
3.对select控件增加和删除Option
1
<
html
>
2
<
head
>
3
<
title
>
test
</
title
>
4
<
script
language
="javascript"
>
5
function test()
{
6
var tbodyElement=document.getElementById("tbody1");
7
var trElement=document.createElement("tr");
8
var idTDElement=document.createElement("td");
9
10
idTDElement.innerHTML=1;
11
var nameTDElement=document.createElement("td");
12
13
var inputElement=document.createElement("input");
14
nameTDElement.appendChild(inputElement);
15
inputElement.type="button";
16
//在IE中,这句话将会抛出异常,但在firefox能正常运行,如果type为text或者不设置type属性,也都能正常运行
17
inputElement.value="Invoke";
18
/**//*
19
修改成下面的语句就能正常运行:
20
var inputElement=document.createElement("input");
21
inputElement.type="button";
22
nameTDElement.appendChild(inputElement);
23
*/
24
25
tbodyElement.appendChild(trElement);
26
trElement.appendChild(idTDElement);
27
trElement.appendChild(nameTDElement);
28
}
29
</
script
>
30
</
head
>
31
<
body
>
32
<
input
type
="button"
value
="insert"
onclick
='test()'
>
33
<
table
cellpadding
="0"
cellspacing
="0"
border
="1"
>
34
<
tbody
id
='tbody1'
>
35
<
tr
>
36
<
td
width
="50"
>
ID
</
td
>
37
<
td
width
="200"
>
name
</
td
>
38
</
tr
>
39
</
tbody
>
40
</
table
>
41
</
body
>
42
</
html
>

2

3

4



5



6

7

8

9

10

11

12

13

14

15

16

17

18


19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

2.appendChild一个radio对象,设置该对象的name属性
1
var
nameTDElement
=
document.createElement(
"
td
"
);
2
var
radioElement
=
document.createElement(
"
input
"
);
3
radioElement.type
=
"
radio
"
;
4
nameTDElement.appendChild(inputElement);
5
radioElement.name
=
"
testRadioName
"
;
//
这句话在firefox是起作用的,但在IE下是不起作用的
6
/**/
/*解决的办法是
7
var radioElement=document.createElement("<input name='testRadioName'>");
8
radioElement.type="radio";
9
nameTDElement.appendChild(inputElement);
10
*/

2

3

4

5

6


7

8

9

10

3.对select控件增加和删除Option
1
<
html
>
2
<
head
>
3
<
title
>
test
</
title
>
4
<
script
language
="javascript"
>
5
function deleteRow()
{
6
var selectElement=document.getElementById("select1");
7
selectElement.options.remove(1); //IE:OK Firefox:Failure
8
selectElement.remove(1); //IE:OK Firefox:OK
9
}
10
function insertRow()
{
11
var selectElement=document.getElementById("select1");
12
var option=new Option("eeee",5);
13
selectElement.add(option); //IE:OK Firefox:Failure
14
selectElement.options.add(option);//IE:OK Firefox:OK
15
}
16
</
script
>
17
</
head
>
18
<
body
>
19
<
input
type
="button"
value
="Delete"
onclick
='deleteRow()'
>
20
<
input
type
="button"
value
="Insert"
onclick
='insertRow()'
>
21
<
select
id
="select1"
>
22
<
option
value
="1"
>
aaa
</
option
>
23
<
option
value
="2"
>
bbb
</
option
>
24
<
option
value
="3"
>
ccc
</
option
>
25
<
option
value
="4"
>
ddd
</
option
>
26
</
select
>
27
</
body
>
28
</
html
>

2

3

4



5



6

7

8

9

10



11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28
