Nico Schuck Nico Schuck -4 years ago 68
HTML Question

Jquery parameters of dom elements

I want to write an own jquery function which do some stuff on all dom elements which has a specially class tag.
But some elements should have some specific animations. Thats why i want to declare some parameters inside of the dom elements like that:

<div class='animate' animate-speed='0.5' animate-dir='up'></div>


Is it possible and if yes how i can get the parameters by jquery.

Answer Source

You can try to use data-attributes.

HTML5 is designed with extensibility in mind for data that should be associated with a particular element but need not have any defined meaning. data-* attributes allow us to store extra information on standard, semantic HTML elements without other hacks such as non-standard attributes, extra properties on DOM, or Node.setUserData().

HTML code :

<div class='animate' data-speed='0.5' data-dir='up'></div>

notice : you can't to use ":" but "="

JS code :

$('.animate').each(function() {
    // acces to attrbiutes, jquery method
    console.log($(this).attr("data-speed"));

    // or javascript method
    console.log(this.dataset.dir); // not with the word data-

});

Example :

try this jsFiddle

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download