若余相思的gravatar头像
若余相思2019-01-05 23:14:34
JavaEE面试题遇到的js问题
 

最近遇到的面试的一道问题,我回来的时候总结了一下:

题目:将表格的奇数行中的每一列的值,以警告框的方式弹出来

html代码:

<!DOCTYPE html>
<html>
<head>
	<title>题目</title>
</head>
<body>
<table border="2" align="center" width="30%">
		<tr>
			<td>A1</td><td>A2</td><td>A3</td>
		</tr>
		<tr>
			<td>B1</td><td>B2</td><td>B3</td>
		</tr>
		<tr>
			<td>C1</td><td>C2</td><td>C3</td>
		</tr>
		<tr>
			<td>D1</td><td>D2</td><td>D3</td>
		</tr>
		<tr>
			<td colspan="3" align="center">
				<input type="button" value="测试" onclick="myclick()" />
			</td>
		</tr>
	</table>
</body>
</html>

 

面试的时候,我是这样写的(请不要笑我!)

 

// 遍历奇数行的每一列的值
  	  	/* function myclick(){
  	  		// 获取行的数量c
  	  		var size = $("table tr").size() - 1;
  	  		// 获得偶数行的jquery对象,根据html代码,这里有两行,所有是个数组
  	  		var $evenTr = $("table tr:lt("+ size+"):even") ;
  	  		// 遍历行
  	  		$evenTr.each(function(){
  	  			// 每行中找到td,td又是个数组,又遍历td,得到td的文本,当然可以用children()替换find("td")
				$(this).find("td").each(function(){
					alert($(this).text()) ;
				})			
  	  		});
	 	} */

 

我回来仔细看了下,我的代码好好笑,为什么这么龙8国际娱乐pt老虎机的问题搞得那么复杂

 

我回来,改进了下,如下

// 遍历奇数行的每一列的值,改进方法
	 	/* function myclick(){
	 		// 获取偶数行的所有列
	 		var $td = $("table tr:NOT(:last):even td") ;
	 		// 遍历这个列数组就可以了
	 		$td.each(function(){
	 			// 弹出每一列的值
	 			alert($(this).text()) ;
	 		})
	 	} */

 

最后附上,用jquery遍历表每一行每一列的值的js

//遍历每一行每一列的值
	 	function myclick(){
	 		// 获取行数
	 		var trSize = $("table tr:NOT(:last)").size() ;
	 		for(var i = 0; i < trSize; i++){
	 			// 获取每一行的列数组
	 			var $td = $("table tr:eq("+ i +") td") ;
	 			// 遍历列数组
	 			$td.each(function(){
	 				// 弹出每一列的值
	 				alert( $(this).text() ) ;
	 			});
	 		}
	 	} 

 

附上整个代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
	 <script type="text/javascript" src="../js/jquery-1.8.2.js"></script>
  	 <script type="text/javascript">
  	 	// 遍历奇数行的每一列的值
  	  	/* function myclick(){
  	  		// 获取行的数量c
  	  		var size = $("table tr").size() - 1;
  	  		// 获得偶数行的jquery对象,根据html代码,这里有两行,所有是个数组
  	  		var $evenTr = $("table tr:lt("+ size+"):even") ;
  	  		// 遍历行
  	  		$evenTr.each(function(){
  	  			// 每行中找到td,td又是个数组,又遍历td,得到td的文本,当然可以用children()替换find("td")
				$(this).find("td").each(function(){
					alert($(this).text()) ;
				})			
  	  		});
	 	} */
	 	// 遍历奇数行的每一列的值,改进方法
	 	/* function myclick(){
	 		// 获取偶数行的所有列
	 		var $td = $("table tr:NOT(:last):even td") ;
	 		// 遍历这个列数组就可以了
	 		$td.each(function(){
	 			// 弹出每一列的值
	 			alert($(this).text()) ;
	 		})
	 	} */
	 	//遍历每一行每一列的值
	 	function myclick(){
	 		// 获取行数
	 		var trSize = $("table tr:NOT(:last)").size() ;
	 		for(var i = 0; i < trSize; i++){
	 			// 获取每一行的列数组
	 			var $td = $("table tr:eq("+ i +") td") ;
	 			// 遍历列数组
	 			$td.each(function(){
	 				// 弹出每一列的值
	 				alert( $(this).text() ) ;
	 			});
	 		}
	 	} 
  	 </script>
  </head>
  <body>
	<table border="2" align="center" width="30%">
		<tr>
			<td>A1</td><td>A2</td><td>A3</td>
		</tr>
		<tr>
			<td>B1</td><td>B2</td><td>B3</td>
		</tr>
		<tr>
			<td>C1</td><td>C2</td><td>C3</td>
		</tr>
		<tr>
			<td>D1</td><td>D2</td><td>D3</td>
		</tr>
		<tr>
			<td colspan="3" align="center">
				<input type="button" value="测试" onclick="myclick()" />
			</td>
		</tr>
	</table>
  </body>
</html>
	
	
	

 

总结,面试的时候,往往很龙8国际娱乐pt老虎机的题目,自己却搞得很复杂,我认为是因为紧张 + 场景(我写的时候CTO就在我旁边看着我写),然后就是知识不够牢固,还是要多做多练。

如果大佬们对上面的题目,还有什么改进的方法,可以尽管提出来,谢谢啦!


打赏

分享到:

最近浏览
灬艾希 LV811小时前
月亮月亮
georgejin LV4昨天
月亮
gaolu514 LV2昨天
星星星星
心中无码 LV2前天
星星星星
sunjiansh LV6前天
月亮星星星星
暂无贡献等级
peijiayang LV5前天
月亮星星
仲恺小霸王 LV3前天
星星星星星星
Le_bobo前天
暂无贡献等级
靓仔zzzz LV5前天
月亮星星
顶部客服微信二维码底部
>扫描二维码关注最代码为好友扫描二维码关注最代码为好友

龙8国际娱乐pt老虎机