数据的含义-*属性

data-*属性用于存储页面或应用程序的私有自定义数据。它是所有HTML元素上的自定义数据属性。它存储的数据可以被JavaScript利用，可以创造更好的用户体验。

数据-*属性包含两部分：

属性名：属性名不能包含任何大写字母，前缀“data-”后必须有字符，不能为空。

属性值：属性值可以是任何字符串。

elementdata-*='somevalue '

例子

数据-动物-类型='动物'

如何使用数据-*属性

由于自定义数据属性是有效的HTML5，因此它们可以在支持HTML5文档类型的任何浏览器中使用：

我们可以设置JavaScript动画中存储的元素的初始高度或不透明度，设置通过JavaScript加载的Flash电影的参数，存储自定义的网络分析标签数据等等。

示例：

！DOCTYPEhtml

超文本标记语言

头

metharset=' UTF-8 '

标题文档/标题

风格

ul{

list-style : none；

}

li{

宽度：50 px；

height:50px

背景色：粉色；

text-align : center；

margin-left :10 px；

行高：50 px；

float:left

}

/style

/head

身体

脚本

函数显示详细信息(动物){

varanimalType=animal . GetAttribute(' data-animal-type ')；

Console.log(animal.innerHTML)是一种“animalType”。);

}

/script

p单击li显示其类别/p

保险商实验所

Li onclick=' show details(this)' id=' owl ' data-animal-type=' animal ' kitten/Li

Li onclick=' show details(this)' id=' salmon ' data-animal-type='水果' apple/Li

/ul

/body

/html

本文转载自中文网站