Get a number for a style value WITHOUT the "px;" suffix

parseInt gives you the numerical value:

var tmp = parseInt(document.getElementById(nameVar).style.left, 10);
console.log(tmp);

or, as @PeteWilson suggests in the comments, use parseFloat


An alternative approach to the one from Konsolenfreddy, is to use:

var numericValue = window
    .getComputedStyle(document.getElementById('div'),null)
    .getPropertyValue('left')
    .match(/\d+/);

JS Fiddle demo.

The benefit of this approach is that it works to retrieve the value set in CSS, regardless of that value being set in the style attribute of the element or in a linked stylesheet, which I think Konsolenfreddy's approach is limited by.

References:

  • window.getComputedStyle().
  • document.getElementById().
  • match().
  • CSSStyleDeclaration.getPropertyValue()
  • Regular Expressions.

You can use .offsetLeft and .offsetTop to get values without px and the return type is numeric.

Demo: http://jsfiddle.net/ThinkingStiff/2sbvL/

Script:

var result = document.getElementById( 'result' ),
    position = document.getElementById( 'position' );

result.textContent = position.offsetLeft + ', ' + position.offsetTop;

HTML:

<div id="position"></div>
<div id="result"></div>

CSS:

#position {
    border: 1px solid black;
    height: 50px;
    left: 50px;
    position: absolute;
    top: 50px;
    width: 50px;
}

Output:

enter image description here