簡化動態jQuery選擇

如下表簡化動態jQuery選擇

<table id="t1" border="1"> 
    <thead><tr><th>A</th><th>B</th><th>C</th></tr></thead> 
    <tfoot><tr><td>0</td><td>1</td><td>2</td></tr></tfoot> 
<tbody> 
    <tr><td>3</td><td>4</td><td>5</td></tr> 
    <tr><td>6</td><td>7</td><td>8</td></tr> 
    <tr><td>9</td><td>10</td><td>11</td></tr> 
    <tr><td>12</td><td>13</td><td>14</td></tr> 
    <tr><td>15</td><td>16</td><td>17</td></tr> 
</tbody> 
</table>

我想只有<tbody>選擇第一和第三列。請注意，對於巨大的表格，多列的選擇可能會有所不同。在這個例子中，下面的表達式返回正確的選擇。

var a = $('#t1 tbody tr td:nth-child(1), #t1 tbody tr td:nth-child(3)')

但

var b = $('#t1 tbody tr td:nth-child(1), td:nth-child(3)')

b將返回選擇包括<tfoot>。 b結果更多，第一個元素缺失？！

對於X列的上述選擇var a的最簡單方法是什麼？例如：

Select columns [1,4,5,6,7,8,9]

http://jsfiddle.net/kkgian/4kdNt/2/

TIA

來源

2012-07-19 Gian

對於同一行中選擇多個列：

$('#t1 tbody tr').find("td:nth-child(1), td:nth-child(3)");

用於以規則間隔的間隔選擇的列：

$('#t1 tbody tr td:nth-child(3n)'); //should get column 3, 6, 9, ...

作爲其中的一個推論，以獲得從1開始每隔一個元素（在你的情況1和3）：

$('#t1 tbody tr td:nth-child(2n+1)'); //should get column 1, 3, 5, ...

對於選擇列[1,4,5,6,7,8,9] ：

var cols = [1,4,5,6,7,8,9]; 
$('#t1 tbody tr td').filter(function(idx) { 
    return $.inArray(idx+1, cols)!=-1; 
});

.filter()是減少匹配的元素集合到那些要使用的方法 - 在這種情況下您的數組中指定列索引。包括表達式返回true的任何值都包括在內。 注意：在.filter()之內idx是基於0的，因此如果數組中的值旨在基於1，請加1。

來源

2012-07-19 06:44:43 nbrooks

http://api.jquery.com/nth-child-selector/ - 當然'：（奇數）第n個孩子'也適用 – nbrooks 2012-07-19 07:03:06

var arr = [1, 4, 5, 6, 7, 8, 9], 
    rows = $('#t1 tbody tr'), 
    tds = $('td', rows).map(function() { 
     if ($.inArray($(this).index(), arr) >= 0) 
      return this; 
    });

Demo

來源

2012-07-19 07:16:09 thecodeparadox

'$ .inArray（）'不會返回一個布爾值，它會返回找到該值的索引或-1（除索引0外全部爲真）。此外，使用'$（this）.index（）'返回匹配集中元素的索引 - 意味着在這種情況下[0,1,2]重複5次。因爲'1'是數組中唯一的值，所以其他的返回-1這是真的 - 因此它們通過。 '1'在索引0處，所以它是錯誤的並且失敗 - 這是該方法實際返回第1列和第3列的唯一原因，純粹的巧合：/ – nbrooks 2012-07-19 11:07:14

簡化動態jQuery選擇

回答

相關問題