Jquery - Что я получаю через метод .find().each()? Объект?

Есть некая таблица. Мне нужно поменять в ней местами некоторые ячейки.

$('table').find('tr').each(function(index, el){
  let e = $(el).find('td');
  $(el).append(e[0]).append(e[2]).append(e[1]));
})

То есть методом $(el).find('td') я получаю массив вида:

['<td>содержимое</td>', '<td>содержимое</td>', '<td>содержимое</td>']

судя по тому что я использую e[0]...
typeof(e) также пишет что это объект.

Но вот поработать с каждым элементом этого объекта я не могу. Например под элементом e[1] находится такой код (<td><span>Фамилия Имя</span></td>).
Ну а мне надо поменять на Имя Фамилия

Ни один метод к e[1] не применяется. Ни реплейс, ни разбивка на еще один массив, ни превращение в строку.

Что тут делать? Не обязательно jquery, можно и чистый, просто уже так вышло что на джквери пошел.


Ответы (1 шт):

Автор решения: stylok

Из постановки задачи не совсем понятно какого уровня сложности предстоят манипуляции с обработкой текста и ячейками, но если по простому (сам подход), то как-то так:

$('table').find('td').each(function(index, el){
    let text = $(el).text();
    // работаем с текстом... 
    // например вашу задачу можно решить простой заменой по условию;
    if(text == 'Фамилия Имя') {
        $(el).text('Имя Фамилия');
    } else if(text == 'содержимое-1') {
        $(el).text('бессодержательное-0');
    }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table border="1" cellspacing="0">
    <tbody>
        <tr>
            <td>содержимое-1</td>
            <td>содержимое-2</td>
            <td>Фамилия Имя</td>
        </tr>
    </tbody>
</table>

→ Ссылка