Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 

  • How to make custom attribute in Html5 ?

    @mukul.kant
    Recommendations Offline Message

    • 0
    • 1
    • 1
    • 1
    • 0
    • 0
    • 0
    • 0
    • 662
    Comment on it

    Hi all,

    You can make your own custom attribute using data-. It allows possessive exchanged information between HTML and its DOM representation. It can work with javascript also, every browser will let you fetch and modify data- attributes using the getAttribute and setAttribute methods,

    Example with css -

    css :-

    section [data-index='123'] {
   color:red;
   width:200px;
}

    HTML :-

    <section data-index="123">
     data attribute
</section>

    Example with javascript-

    Html :-

      <p onclick="showDetails(this)" id="tarantula" data-car-type="spider">Honda city</p>

    script :-

    function showDetails(car) {
    var carType = car.getAttribute("data-car-type");
    alert("This " + car.innerHTML + " is a " +carType + ".");
}
    attribute custom attribute data data- HTML5 html css3 css
    Comment on it

 0 Comment(s)

Sign In
Forgot Password?
                           OR                           
Create an account !!
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: