Question

我有一张这样的表

<table>
    <tr>
        <td>Item1<td>
        <td><p>Description<p><br><td>
    </tr>
    <tr>
        <td>Item2<td>
        <td><p>Description1</p><p>Description2</p><br><td>
    </tr>
    <tr>
        <td>Item3<td>
        <td><p>Description3<p><br><td>
    </tr>
</table>

这是我的javascript来获取一系列项目

var iList = document.querySelectorAll('td:first');

这里是获取所有映射的td p内容

var iDesc = document.querySelectorAll('td:second p');

我想创建一个映射，然后按顺序在onload事件中对其内容进行排序。我正在做的是正确的吗？我的意思是选择器td:first，其次是我的示例表

在上面的示例中，有一个td元素包含2个p的

Answer 1

伪选择器:first和:second不存在，（:first存在于jQuery中，但它不是CSS选择器）。这是the official list of CSS selectors。

这里需要的是:nth-child伪选择器：

var iList = document.querySelectorAll('td:nth-child(1)');    
var iDesc = document.querySelectorAll('td:nth-child(2) p');

PS：请注意您的代码，不要关闭<td>s，而是重新打开新代码，<td> don't have to be closed，这意味着在此<tr>中您有4 {{1} s：

<td>

Answer 2

您应该为每个tr元素运行一个循环，并从td元素中获取键和值。接下来，将它们推入阵列。

var arr = new Array();
$('table tr').each(function() {
    var $row = $(this);
    var key = $row.find('td:first').html();
    var value = $row.find('td:last').html();
    arr.push([key, value]);
});

最后，按照它的第一个索引对数组进行排序。

arr.sort(function(a, b) {
    var valueA, valueB;
    valueA = a[0]; // Where 1 is your index, from your example
    valueB = b[0];
    if (valueA < valueB) {
        return -1;
    }
    else if (valueA > valueB) {
        return 1;
    }
    return 0;
});

Live Demo

list-jquery newb的选择器

2 个答案: