a_document.all.box.value=box.value-优快云博客

本文介绍了一个使用HTML和JavaScript实现的动态表格案例。该案例通过JavaScript实现了对HTML表格的增删改操作，包括添加行、删除指定行以及选择项变化时更新对应输入框的功能。文章详细展示了如何创建表格元素、添加选项并设置事件监听来改变表格内容。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>Test</title>
</head>

var textNumber = 1;

function change(a)
{
/*两个都不行*/
//document.all.box.value = document.all.select1.value;
//document.all.input1.value = document.all.oSelect.value;
alert("123")
//alert(a.value)
//document.getElementById("box").value=document.getElementById("selec").value
//alert(a.parentNode.parentNode.innerHTML)
//a.parentNode.parentNode.parentNode.childNodes[1].childNodes[0].value=a.value
//alert(a.parentNode.parentNode.childNodes[1].value=a.value)
a.parentNode.nextSibling.childNodes[0].value=a.value
}

function DeleteTr(i)
{
var table = document.getElementById("table1");
var tr = table.childNodes[0];

tr.removeChild(tr.childNodes[i]);
}

function AppendTr()
{
textNumber++;

var table = document.getElementById("table1");
var tr = table.childNodes[0];

var trnew = document.createElement("tr");

var td1 = document.createElement("td");

var oSelect = document.createElement("select");
oSelect.setAttribute("id","select1");
oSelect.setAttribute("onChange","change()");
var option11 = document.createElement("option");
option11.text="A.你";
option11.value="YOU";
oSelect.add(option11);
var option12 = document.createElement("option");
option12.text="B.我";
option12.value="MY";
oSelect.add(option12);
var option13 = document.createElement("option");
option13.text="C.他";
option13.value="HE";
oSelect.add(option13);

var td2 = document.createElement("td");

var input1 = document.createElement("input");
input1.setAttribute("name","box");
input1.setAttribute("id","box" );

//td1.appendChild(oSelect);
td1.innerHTML="<select onchange='change(this)' id='selec'><option value='YOU'> 你 </option><option value='YOU1'> 你1 </option></select>"
td2.appendChild(input1);

trnew.appendChild(td1);
trnew.appendChild(td2);

tr.appendChild(trnew);
}

</script>