Как передать число с html в Javascript

152
21 ноября 2018, 18:10

есть верстка:

<div class="panel panel-body">
    <span id="all">140</span>
    <span id="pro">30</span>
</div>

Есть кусок функции JS:

 var dataset = [
        { name: 'New', count: 55 },
        { name: 'Pending', count: 43 }
    ];

Как заменить цифры с js на те что в верстке?

То есть должно получиться вот так:

 var dataset = [
        { name: 'New', count: 140 },
        { name: 'Pending', count: 30 }
    ];
Answer 1

Для этого воспользуйтесь селектором getElementById, чтобы получить нужный элемент по его id и геттером содержимого элемента innerHTML, чтобы затем вставить это содержимое в объекты.

var dataset=[ 
  {name:'New',count:55}, 
  {name:'Pending',count:43} 
] 
console.log('Dataset was:',Object.assign(dataset)) 
let [all,pro]=['all','pro'].map(v=>Number(document.getElementById(v).innerHTML)) 
dataset[0].count=all 
dataset[1].count=pro 
console.log('Dataset became:',dataset)
<div class="panel panel-body"> 
    <span id="all">140</span> 
    <span id="pro">30</span> 
</div>

Answer 2

В вопросе нет тега JQ, но напишу, мало ли кому пригодиться.

var dataset = [ // Есть массив 
  {name: 'New', count: 55}, 
  {name: 'Pending', count: 43} 
]; 
 
// Определяем новые значения count для массива dataset 
var allCount = $('.panel #all').text(); 
var proCount = $('.panel #pro').text();  
// Заменяем старый count на новые данные 
dataset[0].count = parseFloat(allCount); 
dataset[1].count = parseFloat(proCount); 
// P.S. parseFloat, чтобы "число" было числом (а не строкой). 
console.info(dataset);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<div class="panel panel-body"> 
    <span id="all">140</span> 
    <span id="pro">30</span> 
</div>

READ ALSO
Другое действие по повторному клику на кнопке

Другое действие по повторному клику на кнопке

Есть форма поискаПо нажатию на кнопку, появляется input с возможностью ввода поискового запроса

139
Что значит запись вида const { name } = value?

Что значит запись вида const { name } = value?

Увидел в описании использования одного из npm-пакетов запись вида const { NAME } = valueВ JavaScript не профи, так что никак не могу понять/найти зачем эти...

146
Подмена src в iframe для Ion Range Slider и RsForm

Подмена src в iframe для Ion Range Slider и RsForm

Есть калькулятор на RSForm и JSРаньше, когда изменения происходили просто по onchange или oninput какого-либо radio/checkbox, все работало приемлемо

204
Отсеивание элементов массива [дубликат]

Отсеивание элементов массива [дубликат]

На данный вопрос уже ответили:

128