Shulou(Shulou.com)06/01 Report--

This article mainly introduces the relevant knowledge of "how to use the data attribute in HTML5". The editor shows you the operation process through an actual case. The method of operation is simple and fast, and it is practical. I hope this article "how to use the data attribute in HTML5" can help you solve the problem.

Owl

Salmon

Tarantula

The data-* property is used to store private custom data for the page or application.

The data-* attribute gives us the ability to embed custom data attributes on all HTML elements.

The stored (custom) data can be leveraged in the JavaScript of the page to create a better user experience (no Ajax calls or server-side database queries).

The data-* property consists of two parts:

The attribute name should not contain any uppercase letters and must have at least one character after the prefix "data-"

Property value can be any string

The above code is perfectly acceptable, but sometimes we need to save more information about the audio itself, such as the length, speed, and author, rather than the audio source. This requires the use of the Data attribute. The example is as follows:

With these custom Data properties, you can search, filter, and group audio.

How to use the Data attribute in JQuery? JQuery provides many ways to get data from elements. For example, something like this:

Google

If you have an anchor text tag similar to the one above, and you have a data attribute named data-info, you can get any of the attributes, including data-info, in the following ways

$('. Button'). Click (function (e) {

E.preventDefault ()

Thisdata = $(this). Attr ('data-info')

Console.log (thisdata)

})

This is the end of the content on "how to use the data attribute in HTML5". Thank you for reading. If you want to know more about the industry, you can follow the industry information channel. The editor will update different knowledge points for you every day.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.