Question

I am creating a <div> that represents a table row in sql, with php. Fine.
Then I am using a javascript function to test the values of the div (position, width etc).Fine.
But I need to pass another value to the div to be checked by the function. It is there in the database but I don’t know if there is a (simple) way to do it. Ideally it would look something like this.

<div id='plumber5' class='plumber' style='width:50px;left:100px' value='numericValue'>Derek</div>

The inline styles are generated in php, and can’t think of a way of passing a numeric value other than by style (width, height etc) that js can detect.

eg.

<script>
a=document.getElementById('plumber5');
if (a.style.width=>75){
execute something here}
</script>

Instead of using style as a source for testing

Its very troubling!
Thanks

EDIT – solution

function checkData($type){  
    a = document.getElementsByClassName($type);
    for(i = 0; i < a.length; i++)
    {
    if (a[i].getAttribute('data-dob') >= sessionStorage.Value) {
    // execute something here
    }
    }

}

Answer 1

You can use the data attribute of HTML5 to add some custom data to your HTML tags:

http://ejohn.org/blog/html-5-data-attributes/

Example:

<div data-value='10' id='plumber5' class='plumber' style='width: 50px; left: 100px;'>
    Derek
</div>

You can get the value like this:

<script>
    a = document.getElementById('plumber5');
    if (a.getAttribute('data-value') => 75) {
        // execute something here
    }
</script>