【无标题】

1.增加订单

1.获取要操作的表格
2.增加的行的位置在表格的倒数第二行
3.下标：总行数-1 获取表格行目前的最大下标
4.给新增加的行对象 newRow添加 id属性
5.往空行里面增加所需要的单元格

增加案例

      // 增加行
			var myTable = document.getElementById("order");
			function addRow(){
				var rowIndex = myTable.rows.length-1;
				var newRow = myTable.insertRow(rowIndex);// 目前是空行
				newRow.setAttribute("id",rowIndex);// 把新增加的行的下标赋给该行的id属性
				
				// 第1个单元格
				var c0 = newRow.insertCell(0);
				c0.innerHTML = "<input type='text'/>";
				// 第2个单元格
				var c1 = newRow.insertCell(1);
				c1.innerHTML = "<input type='text' style='width:30px'/>";
				// 第3个单元格
				var c2 = newRow.insertCell(2);
				c2.innerHTML = "<input type='text' style='width:30px'/>";
				// 第4个单元格
				var c3 = newRow.insertCell(3);
				c3.innerHTML = "<input type='button' value='删除' οnclick=\"delRow("+newRow.id+")\"/>&nbsp;"+
								"<input type='button' value='确定' οnclick=\"qd("+newRow.id+")\"/>";
			}

2.删除订单

通过行id获取行对象
获取行下标
开始删除行

删除案例

function delRow(rid){//参数：当前操作行的id属性
			// 1.通过行id获取行对象。
			var myRow = document.getElementById(rid);
			// 2.获取行下标
			var rindex = myRow.rowIndex;
			// 3.开始删除行
			myTable.deleteRow(rindex);
		}

3.修改订单

1.获取要操作的行，通过行id
2. 获取当前行的所有单元格，返回的是一个存储单元格的数组
3. 获取当前三个单元格里面文本框的内容，并把文本框的内容赋给单元格数组
4.确定按钮变为修改按钮，修改按钮的 value属性值。操作的是第4单元格
5. 当按钮变为修改的是时候，给修改按钮添加鼠标点击事件，并且调用修改方法

修改案例

                // 修改行
			function update(rid){//参数：当前操作行的id属性
				// 1.获取要操作的行，通过行id
				var myRow = document.getElementById(rid);
				// 2.获取单元格的内容并赋给一个文本框，最后将文本框赋给单元格。
				// 获取当前行的所有单元格，返回的是一个存储单元格的数组
				var cs = myRow.cells;
				// 第1个单元格
				// 获取第1个单元格里面的内容
				var c0 = cs[0].innerHTML;
				console.info(c0);
				//将单元格的内容赋给一个文本框,并将文本框赋给单元格
				cs[0].innerHTML = "<input type='text' value="+c0+" />";
				
				// 第2个单元格
				// 获取第2个单元格里面的内容
				var c1 = cs[1].innerHTML;
				//将单元格的内容赋给一个文本框,并将文本框赋给单元格
				cs[1].innerHTML = "<input type='text' style='width:30px' value="+c1+" />";
				
				// 第3个单元格
				// 获取第3个单元格里面的内容
				var c2 = cs[2].innerHTML;
				//将单元格的内容赋给一个文本框,并将文本框赋给单元格
				cs[2].innerHTML = "<input type='text'  style='width:30px' value="+c2+" />";
				// 3.修改按钮变为确定钮，修改按钮的 value属性值。操作的是第4列/单元格里面的最后一个子节点
				cs[3].lastChild.value="确定";
				// 4.再次调用确定方法
				cs[3].lastChild.setAttribute("onclick","qd('"+rid+"')")
				}

4.确认订单

1.获取要操作的行，通过行id
2. 获取当前行的所有单元格，返回的是一个存储单元格的数组
3. 获取当前三个单元格里面文本框的内容，并把文本框的内容赋给单元格数组
4.确定按钮变为修改按钮，修改按钮的 value属性值。操作的是第4单元格
5. 当按钮变为修改的是时候，给修改按钮添加鼠标点击事件，并且调用修改方法

确认案例

function qd(rid){//参数：当前操作行的id属性
			// 1.获取要操作的行，通过行id
			console.info("rid = "+rid);
			var myRow = document.getElementById(rid);
			// 2.获取当前行里面前三个单元格里面文本框的内容，并把文本框的内容赋给单元格
			// 获取当前行的所有单元格，返回的是一个存储单元格的数组
			var cs = myRow.cells;
			// 第1个单元格
			// 获取单元格里面文本框的值
			var c0 = cs[0].firstChild.value;
			// 将获取的文本框的值赋给第1个单元格
			cs[0].innerHTML = c0;
			
			// 第2个单元格
			// 获取单元格里面文本框的值
			var c1 = cs[1].firstChild.value;
			// 将获取的文本框的值赋给第2个单元格
			cs[1].innerHTML = c1;
			
			// 第3个单元格
			// 获取单元格里面文本框的值
			var c2 = cs[2].firstChild.value;
			// 将获取的文本框的值赋给第3个单元格
			cs[2].innerHTML = c2;
			// 3.确定按钮变为修改按钮，修改按钮的 value属性值。操作的是第4列/单元格
			cs[3].lastChild.value="修改";
			// 当按钮变为修改的是时候，给修改按钮添加鼠标点击事件，并且调用修改方法
			cs[3].lastChild.setAttribute("onclick","update('"+rid+"')")
		}