H5全局属性data-*与jQuery的data()方法

概念:

       data-*是H5新增的全局属性,用来存储页面或应用程序的私有定制数据。这个属性赋予我们在所有HTML元素上嵌入自定义data属性的能力。存储的(自定义)数据能够被页面的JavaScript中利用,以创建更好的用户体验。

组成:

      1.属性名不应该包含任何大写字母,并且在前缀“data-”之后至少有一个字符。

      2.属性值可以是任意字符串。

使用:

     <element data-*="somevalue">


jQuery的data()方法:向被选元素附加数据,或者从被选元素中获取数据

        1.从元素返回数据:$(selector).data(name)   name参数可选,规定要取回的数据的名称。

        2.向元素附加数据:$(selector).data(name,value)  name与value必填,表示设置的数据的名称和值。  

注意:

被添加的元素不会显示在html中。


实例:

在本示例中,使用jQuery的data()方法获取H5 data-id的值,data-id的值为每个学生的学号id。

运行截图:

H5全局属性data-*与jQuery的data()方法

jsp代码:

H5全局属性data-*与jQuery的data()方法

js代码:

H5全局属性data-*与jQuery的data()方法

 


总结:

在动态选中表格中的某一行时,可以使用多种方式。而使用data-*属性可以让我们的逼格看起来高一些。