A real reason to use the data-* attribute in the html element?

Asked

Viewed 1,476 times

5

Can anyone mention a single real case of using the data-* attribute (in the pattern that suggests W3C) for the html root element? If a real reason is not possible, at least then imagine a situation where its use will make little or great difference in this element? Thank you.

  • An example could be found in dropboxes, where in a menu, in the Dropbox li would put (data-target #menu) (if I’m not mistaken) where the menu would be the id of the list of sub-items, so by clicking on the Dropbox it would open the list with id menu.. An example of this can be found in the Sb-admin and Sb-admin 2 templates in startbootstrap.com . I did not put it as an answer because it is rather incomplete, and I cannot draw up an answer now.

  • @lvcs understood about the use in the element li, but what about the html element? Can you imagine a situation or identify a real use case in the html element?

  • Press CTRL+U on this page and look at the source code, there are some examples.

  • 1

    @This Stackoverflow page has no data-* attribute in its html element, unfortunately. Can you, even if it contains no examples, imagine a situation where data-* can be of great or small use in the html element?

  • 1

    Maybe I didn’t understand what your question is then. The element in which your question is placed has an attribute data-questionid="118395", Only the OS personnel can answer. Kicking (too far maybe) this value can be used to point out what the question ID is when someone gives a upvote or downvote.

  • Would you have any reason to not use?

  • 1

    @Renan think it will help, when I spoke html element was saying "use data-* as an attribute of the html tag", understood young?

  • @bfavaretto can’t say. First we need to know a real reason to use... thank you!

  • 1

    For example, if the current page presents a news, why not put the news id as data-noticia-id in the root element, or in the body? If it is a metadata that relates to the most general entity that that html document represents, it makes sense to root it.

  • 2

    Playing devil’s advocate, I’d say a good reason to not use is that the tag html will be parsed before the goal charset, so that if the browser tries to open it without knowing beforehand its encoding (for example, if the file is read from the local file system) it may have problems with Unicote characters within that attribute. For that reason, I would use the body to save "global" attributes to the page, not the html. Now, something very "goal" that would even apply to head, maybe I had to go to html even with restrictions on content.

Show 5 more comments

1 answer

6


When I used HTML4 and its "ancestors", so to speak, I used to declare non-existent attributes that in a syntactic way presented no error, but in a semantic way yes.

W3C realized that there were many cases in which these statements left html polluted and so created the data-whatever.

Example:

If you were to define an input, usually its behavior, by default it would only have a value. Now, if you had a menu, and you need to define multiple behaviors, you could declare them like this:

data-toggle="true"
data-width="500"
data-height="200"
data-resize="true"

Another cool thing, and that the developers used to use input type='hidden' to save values so that no one could access them, today you could already put them in the same input by inserting the data-valor, these two cases are used in various frameworks and plugins, what they bring in themselves and more semantics and reliability in a matter of no conflict with existing attributes.

Compatibility Can I Use data-

  • In the case data-valor I can change to any other name, for example here data-outronome, this is used using javascript correct?

  • 1

    @Guilhermespinxo no! This is HTML5, recommended reading: http://www.devmedia.com.br/utilizando-os-custom-data-attributes-da-html5/28040

  • @Gabrielrodrigues understood his example with the input element, the explanation is also perfect. But it can define a real use case in the element (tag) html, which is the root of all other elements?

  • @Gabrielrodrigues Beware that the part about compatibility of the article you indicated does not make much sense.

  • @bfavaretto I had noticed this, but it was the only article I had ever read and could pass, explains much of what I have already quoted in the reply I will add the can I use

  • 1

    @Ingridfarabulini Did you see the use in html to where? The only use of date- in html tag for me would be to perform some kind of template.

  • So, that’s what I mean, don’t need the can I use. Partial support concerns property dataset in the DOM. That neither the article nor its answer mention. Using attributes prefixed with data- and getattribute always worked.

  • @bfavaretto by it always exist now it just happened to be adopted as standard?

  • No, the recommendation not to create non-existent attributes with any name and always use the prefix came in Html5. What I’m saying is there’s never been any syntactic compatibility issues. HTML5 added a property in the gift elements (the dataset), and the can I use table relates to it.

  • @Gabrielrodrigues so far could not get any real example of using the data-* attribute in an html element. I discovered that it was possible to use, but only through documentation. That is why my question is to know a single real case of use... for I myself have never seen it, but if it is there, available to be used, it is because someone must understand that there is usefulness. But which one? Which ones? Thank you!

  • 1

    @Ingridfarabulini Is that the data attibutes are worth to whichever element. Generally, creating an exception is more costly than not creating. There is no classic use case. There are possible cases, at least hypothetically, and there is the restriction that mgibsonbr quoted. It is not common to do this, but it is also not prohibited.

  • @bfavaretto thanks for the reply. Indeed, it is costly to create restrictions. But we have seen here several cases to "not use" and only some almost non-existent situations of real utility. I’ve never seen your use anywhere. Here comes the question: would the cost of restricting such an attribute not end up being cheap compared to the cost of time thousands of developers will lose to learn something that is in the documentation and that will hardly be used? I would only say no if it was clear that its use will really make a difference and will not be just another unnecessary attribute.

Show 7 more comments

Browser other questions tagged

You are not signed in. Login or sign up in order to post.