html5的自定data

日期:2021-01-20 类型:科技新闻 

关键词:自助建站,专业建站,建站网站,建站平台,网站在线制作app

人们总喜爱往HTML标识上加上自定特性来储存和实际操作数据信息。但这样做的难题是,你不知道道未来会不容易有其它脚本制作把你的自定特性给重设掉,另外,你这样做也会致使html英语的语法上不符Html标准,和1些其它不良反应。这便是为何在HTML5标准里提升了1个自定data特性,你能够拿它做许多有效的事儿。

你能够去读1下HTML5的详尽标准,但这个自定data特性的用法十分的简易,便是你能够往HTML标识上加上随意以 "data-"开始的特性,这些特性网页页面上是无法显示的,它不容易危害到你的网页页面合理布局日风格,但它确是可读可写的。

下面的1个编码片断是1个合理的HTML5标识:

拷贝编码
编码以下:

<div id="awesome"
data-myid="3e4ae6c4e">Some awesome data</div>

但是,如何来载入这些数据信息呢?你自然能够遍历网页页面元向来载入你要想的特性,但jquery早已内嵌了方式来实际操作这些特性。应用jQuery的.data()方式来浏览这些"data-*" 特性。在其中1个方式便是 .data(obj),这个方式是在 jQuery1.4.3版本号后出現的,它能回到相应的data特性。

举个事例,你能够用下面的写法载入 data-myid特性值:

拷贝编码
编码以下:

var myid= jQuery("#awesome").data('myid');
console.log(myid);

你还能够在"data-*" 特性里应用json英语的语法,比如,假如你写出下面的html:

拷贝编码
编码以下:

<div id="awesome-json" data-awesome='{"game":"on"}'></div>

你能够根据js立即浏览这个数据信息,根据json的key值,你能获得相应的value:

拷贝编码
编码以下:

var gameStatus= jQuery("#awesome-json").data('awesome').game;
console.log(gameStatus);

你还可以根据.data(key,value)方式立即给"data-*" 特性取值。1个关键的你要留意的事儿是,这些"data-*" 特性应当和它所属的元素有1定的关系,不必把它当做储放随意物品的储存专用工具。

译者填补:虽然"data-*" 是HTML5才出現的特性,但jquery是通用性的,因此,在非HTML5的网页页面或访问器里,你依然可使用.data(obj)方式来实际操作"data-*" 数据信息。
上一篇:京东E卡应用表明 返回下一篇:没有了