Получить данные из таблицы

@maruo · Регистрация: 26.04.2013

Author24 — интернет-сервис помощи студентам

Таблица генерируется динамически, Мы с одной статической таблицы выбираем предметы переносим их в другую таблицу.
И вот нужно с другой таблицы динамической собрать все данные которые нужны в цикле.
#garant = это статический родитель.

JavaScript    
        
            
                
                
                
                
            
        
    Скопировано
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$('#garant').append(
            '<tr><td class="cell col-md-1 id">'+id+'</td>'+
                    '<td class="cell col-md-1"><img height="50px;" src="'+image+'"></td>'+
                    '<td class="cell col-md-1">'+weapon+'</td>'+
                    '<td class="cell col-md-1">'+name+'</td>'+
                    '<td class="cell col-md-2">'+price+'</td>'+
                    '<td class="cell col-md-3">'+
                    '<input type="text" name="chance" placeholder="%">'+
                    '</td>'+
                    '<td class="cell col-md-4">'+
                    '<div class="profile-input-price-btn col-md-12">'+
                       '<button class="col-md-12 delete" >Удалить</button>'+
                    '</div>'+
                    '</td></tr>'
                    );

Выше код добавляется строка в таблицу.
Нужно через цикл в массив(объект) загнать данные(image,weapon,name,price) каждой строки внутри <tbody id="garant">

Пробовал так не получилось что делал не так?

JavaScript    
        
    Скопировано
1
2
3
4
$('tbody#garant').each(function(){
            var garantI = $(this).closest('td').find('.id').text();
            console.log(garantI);
         });

Добавлено через 10 минут

JavaScript    
        
            
                
                
                
                
            
        
    Скопировано
1
2
3
4
5
6
7
8
9
10
11
12
$('tbody#garant > tr').each(function(i,v){
            var garantI = [
                           $(this).find('.id').text(), 
                           // $(this).find('td > img').attr('src'), 
                           $(this).find('.weapon').text(),
                           $(this).find('.name').text(),
                           $(this).find('.price').text(),
                           $(this).find('td > .chance').val(),
                           ];
 
            console.log(garantI);
         });

Получился такой вариант но у меня иероглифы местами

@maruo · 29.06.2016, 19:05 **[ТС]**

@dzendev · 29.06.2016, 19:29

closest('td') из документации jquery

Получает набор, содержащий ближайшие родительские элементы, которые удовлетворяют указанному селектору, включая начальный элемент.
Сначала, сlosest смотрит на текущий элемент: удовлетворяет-ли он указанному выражению, если да, то просто возвращается непосредственно сам элемент. Если не удовлетворяет, то будет далее продолжаться просмотр документа, родитель за родителем, до тех пор, пока не будет найден соответствующий указанному выражению элемент. В случае, если ни одного элемента не найдено, то ничего не будет возвращено.

Вы выбрали элемент tbody#garant, а затем пытаетесь найти у него родительский элемент td

Что касается второго кода он рабочий, только он берёт строку из ячейки таблицы как есть вместе с переносами строк, это видно на скриншоте консоли. Попробуйте поставить в конце после .text() функцию .trim()
Вот так я сделал

HTML5    
        
            
                
                
                
                
            
        
    Скопировано
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<table>
  <tr>
    <td class="id">Lorem ipsum1.</td>
    <td class="id2">Lorem ipsum11.</td>
  </tr>
  <tr>
    <td class="id">
      Lorem ipsum2.
    </td>
    <td class="id2">
      Lorem ipsum22.
    </td>
  </tr>
  <tr>
    <td class="id">Lorem ipsum3.</td>
    <td class="id2">Lorem ipsum33.</td>
  </tr>
</table>

JavaScript    
        
            
                
                
                
                
            
        
    Скопировано
1
2
3
4
5
6
7
8
9
$('tbody > tr').each(function(i,v){
            var garantI = [
                           $(this).find('.id').text().trim(), 
$(this).find('.id2').text() 
                          
                           ];
 
            console.log(garantI);
         });

Демонстрация http://codepen.io/anon/pen/rLygVw?editors=1111 - если включить консоль в кодепен видно как выводятся значения массива с функцией .trim и без неё

@maruo · 29.06.2016, 19:36 **[ТС]**

dzendev, трим решил, верно. Скажите вот сейчас сохраняется 1 массив только последний.
А нужно что бы каждая ячейка таблицы массив и все это дело в массив.

что то типо такого же как в php

PHP    
        
    Скопировано
1
2
3
foreach($data as $key => $value){
$data[] = array($key => $value);
}

JavaScript    
        
            
                
                
                
                
            
        
    Скопировано
1
2
3
4
5
6
7
8
 $('tbody#garant > tr').each(function(){
         
            garantI = 
                        [
                           {'id'    : $(this).find('.id').text().trim()}, 
                           {'chance' : $(this).find('td > .chance').val()}
                        ];
         });

@dzendev · 29.06.2016, 19:45

Если имеется ввиду многомерный массив, то так

JavaScript    
        
            
                
                
                
                
            
        
    Скопировано
1
2
3
4
5
6
7
var garantI = [];
$('tbody > tr').each(function(i,v){
   garantI[i] = [
      $(this).find('.id').text().trim(), 
      $(this).find('.id2').text().trim()
   ];
});

@maruo · 29.06.2016, 19:45 **[ТС]**

И тут поспешил решил так

JavaScript    
        
            
                
                
                
                
            
        
    Скопировано
1
2
3
4
5
6
7
  $('tbody#main > tr').each(function(){
         
            mainI.push([
                           {'id'    : $(this).find('.id').text().trim()}, 
                           {'chance' : $(this).find('td > .chance').val()}
                        ]);
         });

@Alex_py · 06.06.2022, 21:54

Блин, почему нет универсального способа получить все элементы сразу?

HTML5    
        
            
                
                
                
                
            
        
    Скопировано
1
2
3
4
5
6
<table id="objects">
    <tbody>
        <tr></tr>
        <!--и т.д.-->
    </tbody>
</table>

JavaScript    
        
    Скопировано
1
2
3
$('#objects tbody tr').each(function(fow){
        groups.push($(this))
    })

не хочет выполняться.

PS. Документ готов, таблица отрисована.

Новые блоги и статьи Все статьи Все блоги /
Агрегаты и сущности в DDD микросервисах Javaican 10.04.2025 Разработка современных программных систем часто приводит на распутье: монолит или микросервисы? Даже при выборе микросервисной архитектуры многие команды сталкиваются с проблемой правильного. . .	Многопоточность в C#: Task и параллельное программирование UnmanagedCoder 10.04.2025 Современные процессоры уже давно перестали наращивать тактовую частоту в пользу увеличения количества ядер. Это создало интересную ситуацию: разработчики, привыкшие к последовательному. . .	Линейное решение нелинейной задачи. Формулы от LM по моему решению пока не проверял. В итоговой её формуле видно её заблуждение. Hrethgir 10.04.2025 В продолжение Эта LM дала ответ похожий на нормальный. В комментриях мой комментарий - похоже она ошиблась с выведением итоговой формулы, но остальные проверю. Assistant qwen2. 5-14b-instruct . . . .	Переменные в Python py-thonny 10.04.2025 Переменная в программировании — это символическое имя, связанное с областью памяти, в которой хранится значение. Она позволяет получать доступ к данным через понятные человеку идентификаторы, а не. . .	Многопоточность в C#: Task и асинхронные операции UnmanagedCoder 10.04.2025 Многопоточность позволяет выполнять несколько операций одновременно, что важно для решения двух основных задач: повышения скорости выполнения вычислительно-сложных операций и сохранения отзывчивости. . .
Линейное решение не линейной задачи (емкость вычислений в сравнении с традиционными решениями пока не определена). Hrethgir 10.04.2025 В рамках предстоящих вычислений пришлось (да, я тоже знаю про корень числа, и про степеня, и прочие теоремы, но. . . ) найти способ нахождения отношения двух углов. . . .	Запуск контейнеров Docker на ARM64 Mr. Docker 09.04.2025 Появление таких решений, как Apple M1/ M2, AWS Graviton, Ampere Altra и Raspberry Pi, сделало использование ARM-систем обыденностью для многих разработчиков и DevOps-инженеров. При этом Docker,. . .	Vue SFC компонент на PHP с Fusion Jason-Webb 09.04.2025 PHP на сервере и JavaScript на клиенте — классическое сочетание, которое, несмотря на свою эффективность, создает определенный когнитивный диссонанс при разработке. В этом контексте появляются. . .	TypeScript vs JavaScript: Отличия и когда что использовать Reangularity 09.04.2025 JavaScript появился в 1995 году как творение Брендана Эйха и быстро стал основой интерактивности в вебе. За свою историю он прошел путь от простого языка для манипуляций с DOM до полноценной. . .	Подключение Kafka к Elasticsearch Codd 09.04.2025 Apache Kafka и Elasticsearch — две мощные технологии, которые при совместном использовании создают эффективную платформу для обработки и анализа данных в реальном времени. Kafka, выступая в роли. . .

@maruo 133 / 133 / 48 Регистрация: 26.04.2013 Сообщений: 1,356
	29.06.2016, 19:05 [ТС]
	0

Получить данные из таблицы

Решение