获取跨度标签HTML的值

Question

my span tag looks like this:

<span id="quantity_value" value="1">1</span>

And the value changes by using jquery.

I want to have value of this span as a parameter, when i try with js script:

var number = document.getElementById("quantity_value");

My number is equal to:

'<span id="quantity_value" value="1">1</span>'

But I want number to be equal to value.

Answer 1

If you add:

console.log(number); just after you define it, and look at the debugger, you'll see it has various properties.

You want to get the innerHTML , property:

number.innerHTML

Answer 2

Use

var number = document.getElementById("quantity_value").innerHTML;

By writing only

var number = document.getElementById("quantity_value");

you store object in variable.

Answer 3

I would suggest changing value to a data field to fix your non-standards compliant html, and then you can retrieve that attribute when you need the value. For instance:

 $('#changeValue').on('click', function(){ var newValue = Date.now() % 100; //change the data attribute $('#quantity_value').text(newValue).data('value', newValue); }); $('#getValue').on('click', function(){ console.log($('#quantity_value').data('value')); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <span id="quantity_value" data-value="1">1</span> <div><button id="changeValue">Change Value</button></div> <div><button id="getValue">Get Value</button></div>