What are “data-url” and “data-key” attributes of tag?

前端 未结 4 1008
傲寒
傲寒 2020-12-13 07:25

I\'ve faced two strange attributes of an html tag . They are \"data-url\" and \"data-key\".

What are they and how

4条回答
  •  悲哀的现实
    2020-12-13 07:40

    When Should I Use the Data Attribute?

    Custom data attributes are intended to store custom data private to the page or application, for which there are no more appropriate attributes or elements.


    This time the data attribute is used to indicate the bubble value of the notification bubble.

    Profile
    

    This time is used to show the text for the tooltip.

    This is the link
    

    When Shouldn’t I Use the Data Attribute?

    We shouldn’t use data attributes for anything which already has an already established or more appropriate attribute. For example it would be inappropriate to use:

    8pm
    

    when we could use the already defined datetime attribute within a time element like below:

    
    

    Using Data Attributes With CSS (Attribute selectors)

    [data-role="page"] {
      /* Styles */
    }
    

    Using Data Attributes With jQuery (.attr())

    Google
    

    -

    $('.button').click(function(e) {
       e.preventDefault();
       thisdata = $(this).attr('data-info');
       console.log(thisdata);
     });
    

    Examples and info from here

提交回复
热议问题