zoukankan      html  css  js  c++  java

  • 转：jQuery 遍历Table中tr中的td中的内容

    1、$("#trID td").text()得到的是一个所以trID之中td的值 返回一个字符串。

    2、$("#trID").children 得到一个trID下的所有td，然后遍历$("#trID").children使用.eq(index).text()得到td中的值;

     
    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    2. <htmlxmlns="http://www.w3.org/1999/xhtml"> 
    3. <head> 
    4. <metahttp-equiv="Content-Type"content="text/html; charset=gb2312"/> 
    5. <title>无标题文档</title> 
    6. <scriptlanguage="javascript"src="jquery-1.6.2.min.js"type="text/javascript"></script> 
    7. <scriptlanguage="javascript"> 
    8.  
    9. $(document).ready(function() { 
    10.         $("#table a").each(function (){ 
    11.         this.onclick = function(){ 
    12.             var thisObj = this.parentNode.parentNode; 
    13.             var a = $(thisObj).children(); 
    14.             var arr = new Array(); 
    15.             var laber = $("#xiugai label"); 
    16.             for(var i=0;i<a.length;i++){ 
    17.                 arr[arr.length] = a.eq(i).text(); 
    18.             } 
    19.             for(var i=0;i<laber.length;i++){ 
    20.                 laber.eq(i).text(arr[i]); 
    21.             } 
    22.              
    23.             $("#table").hide(); 
    24.             $("#xiugai").show(2000) 
    25.         } 
    26.     }); 
    27. }); 
    28.  
    29. function fanhui(){ 
    30.     $("#table").show(2000); 
    31.     $("#xiugai").hide(2000);     
    32. } 
    33.  
    34.  
    35. </script> 
    36. </head> 
    37.  
    38. <body> 
    39. <divid ="table">  
    40. <tablewidth="470"border="0"cellspacing="0"cellpadding="0"> 
    41.   <trid="tr1"> 
    42.     <td>id</td> 
    43.     <td>名字</td> 
    44.     <td>密码</td> 
    45.     <td>操作</td> 
    46.   </tr> 
    47.   <trid="tr2"> 
    48.     <td>1</td> 
    49.     <td>张三</td> 
    50.     <td>12</td> 
    51.     <td><ahref="#">删除</a></td> 
    52.   </tr> 
    53.   <trid="tr3"> 
    54.     <td>2</td> 
    55.     <td>李四</td> 
    56.     <td>34</td> 
    57.     <td><ahref="#">删除</a></td> 
    58.   </tr> 
    59.   <trid="tr4"> 
    60.     <td>3</td> 
    61.     <td>王五</td> 
    62.     <td>56</td> 
    63.     <td><ahref="#">删除</a></td> 
    64.   </tr> 
    65.   <trid="tr5"> 
    66.     <td>4</td> 
    67.     <td>六子</td> 
    68.     <td>78</td> 
    69.     <td><ahref="#">删除</a></td> 
    70.   </tr> 
    71. </table> 
    72. </div> 
    73. <divid ="xiugai"style="display:none; background-color:#FFC; height:360px; 260px"> 
    74.     ID：<label></label><br/> 
    75.     姓名:<label></label><br/> 
    76.     密码:<label></label><br/> 
    77.     <buttononclick="fanhui()">返回</button> 
    78. </div> 
    79. </body> 
    80. </html> 
  • 相关阅读:
    JavaScript 原型和原型链 prototype
    javascript dom 表单元素之 radio
    JavaScript Dom 表单元素之 checkbox
    JavaScript DOM 表单元素之 select
    JavaScript-ECMAScript 之模块
    Javascript--ECMAScript 之 this
    Javascript-ECMAscript--Array.prototype.slice() 方法
    JavaScript -ECMAScriopt: Array.prototype.slice.call()详解及转换数组的方法
    JavaScript-ECMASCript apply call bind
    requests的深入刨析及封装调用
  • 原文地址：https://www.cnblogs.com/summer_adai/p/2797142.html
Copyright © 2011-2022 走看看