Как правильно вынести значение с блока?

Question

[Nikita]

Всем привет, у меня такой вопрос, как сделать скрипт, который будет подсчитывать сумму колонки и выводить его?
к примеру, проект делается на SharePoint есть таблица.
К сожалению тут 3 раза встречается значение, у самого нету id
нужно как-то вытянуть значение 70, 20 и 10
как на скрине,
src="https://habrastorage.org/webt/5b/60/2b/5b602bd29c8..." alt="image"/>


и загнать их в одну переменную, чтобы посчитать.
Но они все сделанные статически по типу *

<td class="ms-vb-lastCell ms-cellstyle ms-vb2 ms-vb-lastCell">70</td>
<td class="ms-vb-lastCell ms-cellstyle ms-vb2 ms-vb-lastCell">20</td>
<td class="ms-vb-lastCell ms-cellstyle ms-vb2 ms-vb-lastCell">10</td>

Прошу вас помочь, как мне их определить и просумировать

Comments

[multiscripter]

найди из css-селектором, распарси и суммируй.

[Nikita]

multiscripter, можно гайд какой-то?

[multiscripter]

Никита, Rapen уже предложил на чистом js решение. На Jquery можно сделать что-то типа:
var sum = 0;
$('.ms-vb-lastCell').each(function() { sum += parseInt($(this).text(), 10); });

Answer 1

[Rapen]

реализация:

let td = document.getElementsByTagName('td');
let sum = 0;


for(let i = 0; i < td.length; i++){
	sum += +td[i].innerHTML;
}

А вообще рекомендую изучить DOM

Comments

[Nikita]

Правильно ли я понял, что с помощью данного метода я смогу выводить данные?
Смысл данных манипуляций чтобы выводить отдельной строкой общее значение в который не в таблице
в итоге я хочу получить данные каждого столбца, (70+20+10) и выводить полное значение

[Rapen]

Ну смотрите, создается стек td елементов, именно тех td которые хотите между собой посчитать, инанче он поместит в стек все td из html. Далее считаете стек, как вам удобно я взял for и все добавил в sum и могу этот sum опять же вывести, напр alert(sum)

[Nikita]

Rapen, Проблема в том что они у меня не имеют идентификаторов, это просто с классами class="ms-vb-lastCell ms-cellstyle ms-vb2 ms-vb-lastCell и вот вся проблема, что я не могу сообразить как их отловить

[Rapen]

Отловите их классами, если не хотите создавать кашу в атрибутах) - document.getElementsByClassName('имя класса").

[Nikita]

Rapen, вот только писал) что уже отловил впринципе, но в итоге всеравно sum выдает 0

[Rapen]

Можете фрагмент кода прислать, если не поймете где ошибка:)

[Nikita]

я отлавливаю вот так

<script>



let td = document.getElementsByClassName('ms-vb-lastCell ms-cellstyle ms-vb2 ms-vb-lastCell');
let sum = 0;
var FinalCow;


for(let i = 0; i < td.length; i++){
  sum += +td[i].innerHTML;

FinalCow = sum;

}
</script>

в итоге я хочу в FinalCow выводить общую сумму и показывать ее для начала через console.log
а в дальнейшем добавить в новую строку и выводить)
Спасибо что помогаете)

[Nikita]

Rapen,
может есть возможность связаться по скайпу? целый день ищу возможность как это реализовать и не получается

[Rapen]

Никита, я только что освободился, проверил, вроде все работает Код
Кстати, зачем вам создавать новую переменную FinalCow, когда sum можно сразу вывести?

[Nikita]

Rapen, Добавил точно так-же как у вас, всеравно sum = 0
Не могу понять почему так.
Возможно сам JS грузится перед загрузкой документа? это ведь SharePoint :D
по поводу FinalCow полностью согласен с вами)

[Nikita]

Rapen,
Возможно как-то выловить каждый td из таблицы?

[Rapen]

Никита, Посмотрите внимательно, в jsfiddle все работает, sum выводит значение, значит и у вас должно быть также. Структура html должно быть такая, а не просто td:)

<table>
  <tr><td class='ms-vb-lastCell ms-cellstyle ms-vb2 ms-vb-lastCell'>70</td></tr>
  <tr><td class='ms-vb-lastCell ms-cellstyle ms-vb2 ms-vb-lastCell'>20</td></tr>
  <tr><td class='ms-vb-lastCell ms-cellstyle ms-vb2 ms-vb-lastCell'>10</td></tr>
</table>

[Nikita]

Rapen,
Аналогично в jsfiddle у меня все работает, но в проекте у меня пишет 0
Возможно как-то сузить получение еллементов? чтобы делать поиск только по таблице
вот сама tr

[Nikita]

Rapen,

Вот могу показать все.

таблица

__



__


__

Можно как-то делать поиск более точный?
Просто это Sharepoint и как я понял каждая таблица будет в дальнейшем иметь такие же классы и т.д

[Rapen]

Цикл не идет, либо он получает нулевой стек-массив, либо NaN, поэтому sum не изменяется. И это как бы и подразумевал более точный, т.е прямая ссылка на элемент, чтобы все работало, думаю нужно добавить спец. класс к тем td-элементам, в которых вы храните числовые данные.

Answer 2

[Nikita]

Смысл в том, чтобы выводить отдельной строкой общее значение.