JavaScript中几个常见的实现Demo

实行对一个表格中的奇偶行进行不同颜色的显示效果，原始表格效果如下：

 具体实现：原始表格的实现很简单，我们只需要对表格中的表头和表体进行标明即可

				
					编号
					姓名
					年龄
				
				
				
				
					1
					张三
					22
				
				
					2
					李四
					25
				
				
					3
					王五
					27
				
				
					4
					赵六
					29
				
				
					5
					田七
					30
				
				
					6
					汾九
					20
				
				

下面需要做的就是利用JS对表格进行渲染，首先需要确定一个事件，这里我们使用onload事件，函数名称为init(),第二步我们需要实现这个init()函数，实现代码如下：

进行渲染之后的效果图如下： 

 在上一个原始表格的基础上，我们不在对奇偶行进行不同效果的渲染，我们通过鼠标的触发来实现不同的效果，当鼠标移动到表格上，该行进行颜色的改变，当鼠标移走，渲染效果消失。具体实现如下：

				
					1
					张三
					22
				
				
					2
					李四
					25
				
				
					3
					王五
					27
				
				
					4
					赵六
					29
				
				
					5
					田七
					30
				
				
					6
					汾九
					20
				
				

 实现复选框的全选和全不选：

				
					
						
						
					
				
				
					
					编号
					姓名
					年龄
				
			
			
				
					
					1
					张三
					22
				
				
					
					2
					李四
					25
				
				
					
					3
					王五
					27
				
				
					
					4
					赵六
					29
				
				
					
					5
					田七
					30
				
				
					
					6
					汾九
					20
				
			

 利用按钮对下面的文本进行添加功能

 实现籍贯的添加，选择前一个之后，后面的城市自动添加：