JQuery условный селектор для строк таблицы

У меня есть таблица с данными в:

<td> item </td><td> order code </td><td> price </td>

Я обрабатываю таблицу с помощью jQuery, который должен найти код заказа:

$.each($('.productList tbody tr'), function() {
    var orderCode = $(this).find('td:eq(1)').html().trim();
    // do stuff
});

Если нет продуктов, в таблице отображается сообщение:

<td colspan="3"> There are no products to display </td>

В приведенной выше строке функция jQuery выгружается. Какой самый надежный способ использования условного селектора игнорировать строку "нет продуктов"? Есть ли селектор для colspan="1" или colspan is not set или что бы это было необходимо?

Ответ 1

Не уточняйте свой селектор, он не будет хорошо масштабироваться, потому что jQuery должен будет оценивать каждый дочерний элемент. Избегайте ошибки...

$('.productList tbody tr').each(function() { 
   var orderCode = $(this).find('td:eq(1)');

   if(orderCode.length > 0) { // Make sure it exists
     orderCode = orderCode.html().trim(); 
     // do stuff 
   }
});

Ответ 2

Вот так:

$('.productList tbody tr:has(td:nth-child(2))').each(function() {
    ...
});

Здесь будут выделены только элементы <tr>, у которых есть <td>, который является вторым потомком его родителя. (nth-child селектор основан на одном)

Ответ 3

Если вы можете изменить способ генерации таблицы, использование классов - это более чистое решение:

<td class="item-name"> item </td>
<td class="order-code"> order code </td>
<td class="item-price"> price </td>

Затем выберите только нужный класс:

var orderCode = $(this).find('td.order-code').html().trim();
if(orderCode)
{
  //do stuff
}

Это также даст вам большую гибкость в стилизации таблицы с помощью CSS, и ваш код не будет ломаться, если вы добавите или измените порядок столбцов.

Ответ 4

Вы можете проверить, сколько td есть:

$.each($('.productList tbody tr'), function() {
    var tds = $(this).find('td');
    if(tds.length >= 2) {
        var orderCode = tds.eq(1).html().trim();
        // do stuff
    }
});

Ответ 5

Используйте метод .attr(). Проверьте api.jquery.com, и это должно помочь вам понять, как получить атрибут colspan из ваших ячеек.

Ответ 6

Больше фильтрации на то, что написал SLaks

$("table tbody tr td:nth-child(2):contains('code')")