Text Value From HTML Into Javascript Var?

Question

I would like to know if the following line is the correct way to take html and put it into a Javascript var as numeric value?

var thePoolHeatingFeeRounded = Number(document.getElementsById("priceDisplayPoolHeating").innerHTML);

Nevermind that the variable name has the word 'rounded' in it. The value that I am trying to put into this var is a 2 point float that has already been rounded and it exist as html.

Below is the line of HTML code that is referenced by getElementsById...

$<div id="priceDisplayPoolHeating" class="priceDisplay">8.00</div>

Any input is greatly appreciated.

Yes, this seems right. You will need to check for NaN, unless you have validation in place that takes care of non-numbers. — PM 77-1
– PM 77-1, Commented Oct 17, 2014 at 1:00

nothingisnecessary · Accepted Answer · 2014-10-17 01:07:26Z

3

Try this instead:

var thePoolHeatingFeeRounded = Number(document.getElementById("priceDisplayPoolHeating").innerHTML);

You were calling getElementsById which is not correct (it is not plural), I changed it to getElementById

Tip: if you need to check whether the Number is valid you can use !isNaN(thePoolHeatingFeeRounded) or use a trick to turn it into a default number (such as 0 or -1) like this:

var thePoolHeatingFeeRounded = Number(document.getElementById("priceDisplayPoolHeating").innerHTML) || 0;

You can also use parseFloat():

var thePoolHeatingFeeRounded = parseFloat(document.getElementById("priceDisplayPoolHeating").innerHTML) || 0;

edited Oct 17, 2014 at 1:07

answered Oct 17, 2014 at 1:00

nothingisnecessary

6,26138 silver badges64 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Alex Williams Over a year ago

Thanx for that info on parseFloat().

Ian Hazzard · Accepted Answer · 2014-10-17 01:11:12Z

1

You are very close. Supposed to be getElementById, not Elements. I created a little code to show you how it works.

Here's what the code looks like in this website's code displayer:

function displayText(){

var thePoolHeatingFeeRounded = Number(document.getElementById("priceDisplayPoolHeating").innerHTML)

  alert(thePoolHeatingFeeRounded);
}

<div id="priceDisplayPoolHeating">8.01</div><input type="button" onclick="displayText()" value="Display the innerHTML of Pool Heating">

edited Oct 17, 2014 at 1:11

answered Oct 17, 2014 at 1:04

Ian Hazzard

7,7688 gold badges37 silver badges61 bronze badges

7 Comments

Alex Williams Over a year ago

Great! Can you tell me why the .00 has been peeled off of the var?

Alex Williams Over a year ago

I guess the Number() function requires me to specify 2 point floats?

Ian Hazzard Over a year ago

The Number() function converts the string to function, and reduces it to the simplest form.

Alex Williams Over a year ago

Okay, now I'm confused. How'd you get Number() to display the number as a 2 point float without adding any arguments?

Ian Hazzard Over a year ago

What do you mean arguments?

|

Collectives™ on Stack Overflow

Text Value From HTML Into Javascript Var?

2 Answers 2

1 Comment

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related