innerHTML в сочетании с parseFloat

Question

То, что я пытаюсь сделать, может быть достигнуто следующим ...

elementContent = document.getElementById('docElement').innerHTML;
elementContent = parseFloat(elementContent);

или даже ...

elementContent = parseFloat( document.getElementById('docElement').innerHTML );

, но я не могу помочьИнтересно, есть ли более элегантный способ извлечения и назначения содержимого DOM как плавающего объекта, о котором я могу не знать.Любое понимание?

Answer 1

Существует унарный оператор плюс , который пытается преобразовать строку (или toString() другого типа) в число. Это будет использоваться как:

elementContent = +document.getElementById('docElement').innerHTML;

Как уже упоминали другие, вы также можете использовать jQuery как синтаксический сахар для .innerHTML и здесь.

Answer 2

Это хороший способ делать вещи.Единственное, что я могу предложить, это то, что если вы можете избежать работы с разметкой HTML полностью, сохраняя «чистое» число в качестве атрибута элемента, это было бы предпочтительнее, так как это могло бы обойти проблемы, которые могут возникнуть, еслиHTML становится интереснее, чем вы ожидаете.(Например, иногда дизайнеры хотят, чтобы отрицательные числа форматировались с символом «минус» Юникода вместо простого дефиса, потому что он выглядит лучше.)

Таким образом, если бы вы могли генерировать свои элементы, как это:

<span id='docElement' data-value='29.20221'>29.20221</span>

тогда вместо доступа к значению как ".innerHTML" вы будете использовать ".getAttribute ()":

var value = document.getElementById('docElement').getAttribute('data-value');
value = parseFloat(value);

Answer 3

Если вы используете библиотеку, такую ​​как jQuery , код для этого будет более элегантным, например:

var el = parseFloat( $('#docElement').text() );

Не забывайте, что вы можете столкнуться с проблемой, когда вынужно также trim() строку.

Answer 4

Использовать JQuery:

var html = parseFloat($('#docElement').html());
$('#docElement').html(html);