Заменить строку на число в javascript

Привет всем, мне нужно получить сумму чисел, но я получил только строку, поэтому мне нужно получить числа. Как мне поменять его на номер? Я пробовал parseInt и Number, но ничего не помогает

var td = document.getElementsByTagName("td");
var input = document.getElementById("myInput");


for ( var i = 0; i < td.length; i++ ){
		td[i].addEventListener("click", activeTd);
	}



function activeTd(event){
	var result = 0;
	for ( var i = 0; i < td.length; i++ ){
		event.target.style.color = "red";
		
	}
    var btn = document.getElementById("myBtn");
	btn.addEventListener("click", activeAll);

	function activeAll(){
		if ( event.target.style.color = "red" ){
			result = Number(event.target.innerHTML);
			input.value += result;
		}
    }
	
}

<table>
  <tr>
    <td>1</td>
    <td>11</td>
    <td>8</td>
  </tr>
  <tr>
    <td>54</td>
    <td>13</td>
    <td>22</td>
  </tr>
  <tr>
    <td>15</td>
    <td>23</td>
    <td>6</td>
  </tr>
</table>
<input type = "text" id = "myInput">
<button id = "myBtn">Start</button>

javascript type-conversion

15.04.2018 09:43

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

value элемента input всегда является строкой, поэтому, когда вы добавляете эту строку к другой переменной, даже если эта другая переменная является number, результатом является сокатенация, а не сложение. Сначала наберите input.value на номер:

var td = document.getElementsByTagName("td");
var input = document.getElementById("myInput");


for (var i = 0; i < td.length; i++) {
  td[i].addEventListener("click", activeTd);
}



function activeTd(event) {
  var result = 0;
  for (var i = 0; i < td.length; i++) {
    event.target.style.color = "red";

  }
  var btn = document.getElementById("myBtn");
  btn.addEventListener("click", activeAll);

  function activeAll() {
    if (event.target.style.color = "red") {
      input.value = Number(event.target.textContent) + Number(input.value);
    }
  }

}

<table>
  <tr>
    <td>1</td>
    <td>11</td>
    <td>8</td>
  </tr>
  <tr>
    <td>54</td>
    <td>13</td>
    <td>22</td>
  </tr>
  <tr>
    <td>15</td>
    <td>23</td>
    <td>6</td>
  </tr>
</table>
<input type = "text" id = "myInput" value = "0">
<button id = "myBtn">Start</button>

15.04.2018 09:47

Ваш целевой input.value - это строка, любое добавление возвращает строку, даже если значение является числом. Затем вам нужно взять значение input.value, преобразовать его в число, добавить значение как число и присвоить его обратно.

input.value = +input.value + +event.target.innerHTML

var td = document.getElementsByTagName("td");
var input = document.getElementById("myInput");

for (var i = 0; i < td.length; i++) {
    td[i].addEventListener("click", activeTd);
}

function activeTd(event) {
    var result = 0;
    for (var i = 0; i < td.length; i++) {
        event.target.style.color = "red";
    }
    var btn = document.getElementById("myBtn");
    btn.addEventListener("click", activeAll);

    function activeAll() {
        if (event.target.style.color = "red") {
            input.value = +input.value + +event.target.innerHTML
        }
    }
}

<table><tr><td>1</td><td>11</td><td>8</td></tr><tr><td>54</td><td>13</td><td>22</td></tr><tr><td>15</td><td>23</td><td>6</td></tr></table>
<input type = "text" id = "myInput">
<button id = "myBtn">Start</button>

просто подсказка, вы можете предотвратить ввод строк (которые дают NaN, а не число) при вводе с помощью атрибута disabled.

— 15.04.2018 10:08

15.04.2018 09:47