TD обозначает в объект с Jquery? - PullRequest
Новая
       1

TD обозначает в объект с Jquery?

1 голос
/ 08 января 2020

У меня есть таблица, как показано ниже: 

<table class="job-details">
                <tr class="spacer-row"><td class="graphic-cell"></td><td class="visible-cell"></td></tr>
                    <tr class="data-row unknown-bin-type" data-toggle="tooltip" title="Waste-15-021219">
                        <td class="graphic-cell"></td>
                        <td class="visible-cell reschedule-cell">
                            <label for="Friday">Friday</label> &nbsp;
                            <label for="">10/01/2020</label> &nbsp;
                            <label for="Deliver_CADDY">Deliver CADDY</label>
                        </td>
                    </tr>
                    <tr class="spacer-row"><td></td></tr>
                    <tr class="data-row non-recyclable-bin-type" data-toggle="tooltip" title="Waste-15-091219">
                        <td class="graphic-cell"></td>
                        <td class="visible-cell">
                            <label for="Monday">Monday</label> &nbsp;
                            <label for="">13/01/2020</label> &nbsp;
                            <label for="Empty_Standard_General_Waste">Empty Standard General Waste</label>
                        </td>
                    </tr>
                    <tr class="spacer-row"><td></td></tr>
                    <tr class="data-row recyclable-bin-type" data-toggle="tooltip" title="Waste-11 Organic-091219">
                        <td class="graphic-cell"></td>
                        <td class="visible-cell">
                            <label for="Monday">Monday</label> &nbsp;
                            <label for="">20/01/2020</label> &nbsp;
                            <label for="Empty_Standard_Mixed_Recycling">Empty Standard Mixed Recycling</label>
                        </td>
                    </tr>
                    <tr class="spacer-row"><td></td></tr>
                    <tr class="data-row green-waste-bin-type" data-toggle="tooltip" title="Waste-15-161219">
                        <td class="graphic-cell"></td>
                        <td class="visible-cell">
                            <label for="Monday">Monday</label> &nbsp;
                            <label for="">20/01/2020</label> &nbsp;
                            <label for="Empty_Standard_Garden_Waste">Empty Standard Garden Waste</label>
                        </td>
                    </tr>
                    <tr class="spacer-row"><td></td></tr>
                    <tr class="data-row non-recyclable-bin-type" data-toggle="tooltip" title="Waste-15-231219">
                        <td class="graphic-cell"></td>
                        <td class="visible-cell">
                            <label for="Monday">Monday</label> &nbsp;
                            <label for="">27/01/2020</label> &nbsp;
                            <label for="Empty_Standard_General_Waste">Empty Standard General Waste</label>
                        </td>
                    </tr>
                    <tr class="spacer-row"><td></td></tr>
                    <tr class="data-row green-waste-bin-type" data-toggle="tooltip" title="Waste-15-301219">
                        <td class="graphic-cell"></td>
                        <td class="visible-cell">
                            <label for="Monday">Monday</label> &nbsp;
                            <label for="">03/02/2020</label> &nbsp;
                            <label for="Empty_Standard_Garden_Waste">Empty Standard Garden Waste</label>
                        </td>
                    </tr>
                    <tr class="spacer-row"><td></td></tr>
                    <tr class="data-row recyclable-bin-type" data-toggle="tooltip" title="Waste-11 Organic-060120">
                        <td class="graphic-cell"></td>
                        <td class="visible-cell">
                            <label for="Monday">Monday</label> &nbsp;
                            <label for="">03/02/2020</label> &nbsp;
                            <label for="Empty_Standard_Mixed_Recycling">Empty Standard Mixed Recycling</label>
                        </td>
                    </tr>
                    <tr class="spacer-row"><td></td></tr>
                    <tr class="data-row non-recyclable-bin-type" data-toggle="tooltip" title="Waste-15-060120">
                        <td class="graphic-cell"></td>
                        <td class="visible-cell">
                            <label for="Monday">Monday</label> &nbsp;
                            <label for="">10/02/2020</label> &nbsp;
                            <label for="Empty_Standard_General_Waste">Empty Standard General Waste</label>
                        </td>
                    </tr>
                    <tr class="spacer-row"><td></td></tr>
                    <tr class="data-row green-waste-bin-type" data-toggle="tooltip" title="CADDY DELIVERY-Caddy Delivery 145-100120">
                        <td class="graphic-cell"></td>
                        <td class="visible-cell">
                            <label for="Monday">Monday</label> &nbsp;
                            <label for="">17/02/2020</label> &nbsp;
                            <label for="Empty_Standard_Garden_Waste">Empty Standard Garden Waste</label>
                        </td>
                    </tr>
                    <tr class="spacer-row"><td></td></tr>
                    <tr class="data-row recyclable-bin-type" data-toggle="tooltip" title="Waste-15-130120">
                        <td class="graphic-cell"></td>
                        <td class="visible-cell">
                            <label for="Monday">Monday</label> &nbsp;
                            <label for="">17/02/2020</label> &nbsp;
                            <label for="Empty_Standard_Mixed_Recycling">Empty Standard Mixed Recycling</label>
                        </td>
                    </tr>
                    <tr class="spacer-row"><td></td></tr>

            </table>

Что я пытаюсь сделать, это извлечь каждый тд с вызовом visible-cell в объект, подобный так:

{['Friday','10/01/2020','Delivery Caddy'],['Monday','13/01/2020','Empty Standard General Waste']}

Пока у меня все есть в массиве, но я не могу понять, как его разделить, как указано выше 

    $('.visible-cell label').each(function() {
        const label = $(this).text();
        labels.push(label)
    });

1 Ответ

3 голосов
/ 08 января 2020

Вы хотите поместить все это в массив, поскольку у объектов есть ключи для каждого значения.

Вот простой способ добиться этого, удалив пустые вложенные массивы. 

const labels = [];
const keys = ['day', 'date', 'type'];

$('.visible-cell').each(function() {
  const label = {};
  $('label', this).each(function (i) {
    label[keys[i]] = $(this).text();
  });
  if (!$.isEmptyObject(label)) labels.push(label);
});

console.log(labels);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<table class="job-details">
  <tr class="spacer-row">
    <td class="graphic-cell"></td>
    <td class="visible-cell"></td>
  </tr>
  <tr class="data-row unknown-bin-type" data-toggle="tooltip" title="Waste-15-021219">
    <td class="graphic-cell"></td>
    <td class="visible-cell reschedule-cell">
      <label for="Friday">Friday</label> &nbsp;
      <label for="">10/01/2020</label> &nbsp;
      <label for="Deliver_CADDY">Deliver CADDY</label>
    </td>
  </tr>
  <tr class="spacer-row">
    <td></td>
  </tr>
  <tr class="data-row non-recyclable-bin-type" data-toggle="tooltip" title="Waste-15-091219">
    <td class="graphic-cell"></td>
    <td class="visible-cell">
      <label for="Monday">Monday</label> &nbsp;
      <label for="">13/01/2020</label> &nbsp;
      <label for="Empty_Standard_General_Waste">Empty Standard General Waste</label>
    </td>
  </tr>
  <tr class="spacer-row">
    <td></td>
  </tr>
  <tr class="data-row recyclable-bin-type" data-toggle="tooltip" title="Waste-11 Organic-091219">
    <td class="graphic-cell"></td>
    <td class="visible-cell">
      <label for="Monday">Monday</label> &nbsp;
      <label for="">20/01/2020</label> &nbsp;
      <label for="Empty_Standard_Mixed_Recycling">Empty Standard Mixed Recycling</label>
    </td>
  </tr>
  <tr class="spacer-row">
    <td></td>
  </tr>
  <tr class="data-row green-waste-bin-type" data-toggle="tooltip" title="Waste-15-161219">
    <td class="graphic-cell"></td>
    <td class="visible-cell">
      <label for="Monday">Monday</label> &nbsp;
      <label for="">20/01/2020</label> &nbsp;
      <label for="Empty_Standard_Garden_Waste">Empty Standard Garden Waste</label>
    </td>
  </tr>
  <tr class="spacer-row">
    <td></td>
  </tr>
  <tr class="data-row non-recyclable-bin-type" data-toggle="tooltip" title="Waste-15-231219">
    <td class="graphic-cell"></td>
    <td class="visible-cell">
      <label for="Monday">Monday</label> &nbsp;
      <label for="">27/01/2020</label> &nbsp;
      <label for="Empty_Standard_General_Waste">Empty Standard General Waste</label>
    </td>
  </tr>
  <tr class="spacer-row">
    <td></td>
  </tr>
  <tr class="data-row green-waste-bin-type" data-toggle="tooltip" title="Waste-15-301219">
    <td class="graphic-cell"></td>
    <td class="visible-cell">
      <label for="Monday">Monday</label> &nbsp;
      <label for="">03/02/2020</label> &nbsp;
      <label for="Empty_Standard_Garden_Waste">Empty Standard Garden Waste</label>
    </td>
  </tr>
  <tr class="spacer-row">
    <td></td>
  </tr>
  <tr class="data-row recyclable-bin-type" data-toggle="tooltip" title="Waste-11 Organic-060120">
    <td class="graphic-cell"></td>
    <td class="visible-cell">
      <label for="Monday">Monday</label> &nbsp;
      <label for="">03/02/2020</label> &nbsp;
      <label for="Empty_Standard_Mixed_Recycling">Empty Standard Mixed Recycling</label>
    </td>
  </tr>
  <tr class="spacer-row">
    <td></td>
  </tr>
  <tr class="data-row non-recyclable-bin-type" data-toggle="tooltip" title="Waste-15-060120">
    <td class="graphic-cell"></td>
    <td class="visible-cell">
      <label for="Monday">Monday</label> &nbsp;
      <label for="">10/02/2020</label> &nbsp;
      <label for="Empty_Standard_General_Waste">Empty Standard General Waste</label>
    </td>
  </tr>
  <tr class="spacer-row">
    <td></td>
  </tr>
  <tr class="data-row green-waste-bin-type" data-toggle="tooltip" title="CADDY DELIVERY-Caddy Delivery 145-100120">
    <td class="graphic-cell"></td>
    <td class="visible-cell">
      <label for="Monday">Monday</label> &nbsp;
      <label for="">17/02/2020</label> &nbsp;
      <label for="Empty_Standard_Garden_Waste">Empty Standard Garden Waste</label>
    </td>
  </tr>
  <tr class="spacer-row">
    <td></td>
  </tr>
  <tr class="data-row recyclable-bin-type" data-toggle="tooltip" title="Waste-15-130120">
    <td class="graphic-cell"></td>
    <td class="visible-cell">
      <label for="Monday">Monday</label> &nbsp;
      <label for="">17/02/2020</label> &nbsp;
      <label for="Empty_Standard_Mixed_Recycling">Empty Standard Mixed Recycling</label>
    </td>
  </tr>
  <tr class="spacer-row">
    <td></td>
  </tr>
</table>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...