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

In this issue, the editor will bring you about how to operate the global properties of HTML data in jquery. The article is rich in content and analyzes and narrates it from a professional point of view. I hope you can get something after reading this article.

Data-* global attributes are a class of attributes called custom data attributes, which give us the ability to embed custom data attributes on all HTML elements and exchange proprietary data with HTML through scripts (generally referred to as JavaScript).

To put it simply, the html element can store some data through the data-* attribute, similar to a map, which is very convenient if we want to store something extra on the html element.

One: there is no problem with reading.

For example, we read the data of data-num in div:

DataSet

Read with jquery and js, respectively, and the result is 1.

Two: if you modify it, there will be a pit.

But when you modify the data-num, it's interesting:

Jquery sets the value in data-num to 2

The jquery read value is 2

The value of the js read value is 1. Strange, look at the html element.

The value of data-num is still 1.

This pit cheated me all morning, and only later did Baidu know that the value set by jquery was in the cache.

Take a decisive look at the source code of jquery. The truth is in the code:

Three: the correct way of use

If you need to modify the data on the dom element, you must use the js method:

Document.getElementById ("div1") .dataset.num = "3"

Four: conclusion

There is no doubt that jquery uses caching to improve the efficiency of reading and writing, but caching is a double-edged sword, which often brings trouble when it is convenient for us to use. It is recommended that the operation of data should be unified, using jquery or js, not mixed with it. If you want to change the value of elements on dom, you can only use js.

PS: similar to the cache pit is the Integer class in java. The values of-128to127in Integer are stored in the cache.

So when the values of two Integer are compared with each other, if the value is between-128and 127and the two numbers are the same, using the = = sign will return true, and outside the range of-128and 127will return false, which will cause additional trouble to people. Be sure to use the equals () method to compare Integer in java.

The above is how to manipulate the global properties of HTML data in the jquery shared by the editor. If you happen to have similar doubts, you might as well refer to the above analysis to understand. If you want to know more about it, you are welcome to follow the industry information channel.

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.