【转载】HTML5自定义data属性

【【转载】HTML5自定义data属性】的更多相关文章

【翻译】详解HTML5 自定义 Data 属性

原标题:HTML5 Custom Data Attributes (data-*) 你是否曾经使用 class 或 rel 来保存任意的元数据,只为了使你的JavaScript更简单?如果你回答是的,那么我有一个令人激动的消息要告诉你!如果你回答不是,并且你还想,“咦,这个主意不错哦~”,那我劝你尽早放弃这个幼稚的想法,并看完本文. 多亏了HTML5,我们可以嵌入自定义的 data 属性给所有的HTML元素.这个 data 属性包含两部分: 属性名属性名以'data-'前缀开头,并且至少要有一…

【转载】HTML5自定义data属性

可能大家在使用jquery mobile时,经常会看到data-role.data-theme等的使用,比如:通过如下代码即可实现页眉的效果: [html] <div data-role="header"> <h1>我是标题</h1> </div> 为什么写一个data-role="header"就能实现底部为黑色.文字居中显示的效果呢? 本文提供一种最简单的实现办法,让大家对这些用法有…

HTML5自定义data属性

可能大家在使用jquery mobile时,经常会看到data-role.data-theme等的使用,比如:通过如下代码即可实现页眉的效果: [html] <div data-role="header"> <h1>我是标题</h1> </div> 为什么写一个data-role="header"就能实现底部为黑色.文字居中显示的效果呢? 本文提供一种最简单的实现办法,让大家对这些用法有个直观的了解. 我们写…

js（jQuery）获取自定义data属性的值

有时候因为需要在标签上设置自定义data属性值, <div class="col-sm-6 col-md-4" id="get_id" data-c_id="1233"> data-c_id 可以是动态赋值有时候会出现获取不到的情况,检查是否把data-* ,后面的字符名称包含了大写,这里统一用小写,以免出现问题. 在js中获取,可以使用 $("get_id").data("c_id");…

js 获取html5的data属性

我以前一直以为只能用jquery的data()来获取哈哈是我太弱了 <!DOCTYPE html> <html> <head> <title>dataset</title> <meta charset="utf-8"> </head> <body> <div id='div' data-index='demo'> </div> </body> <…

js获取自定义data属性

<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <div id="tree" data-leaves="47" data-plant-height="2.4m">…

js取自定义data属性

//20170329 原本以为只能attr或者prop来获取属性,但是今天看别人的代码他自定义了一个属性,却取不到他的属性值,我自己在本地又可以取到,难道是phtml的原因,于是我到网上查找,发现了一个新的方法. 这data()竟然可以取到data下面的自定义属性,好神奇.…

html5的自定义data-＊属性和jquery的data()方法的使用示例

人们总喜欢往HTML标签上添加自定义属性来存储和操作数据. 但这样做的问题是,你不知道将来会不会有其它脚本把你的自定义属性给重置掉,此外,你这样做也会导致html语法上不符合Html规范,以及一些其它副作用. 这就是为什么在HTML5规范里增加了一个自定义data属性,你可以拿它做很多有用的事情. 你可以去读一下HTML5的详细规范,但这个自定义data属性的用法非常的简单,就是你可以往HTML标签上添加任意以 "data-"开头的属性,这些属性页面上是不显示的,它不会影响到你的页面布…

html5 data属性的使用

html5 data属性定义和用法 <ul> <li data-animal-type="bird">Owl</li> <li data-animal-type="fish">Salmon</li> <li data-animal-type="spider">Tarantula</li> </ul> data-* 属性用于存储页面或应用程序的私有自定义…

HTML data属性简介以及低版本浏览器兼容算法

实例使用 data-* 属性来嵌入自定义数据: <ul> <li data-animal-type="bird">Owl</li> <li data-animal-type="fish">Salmon</li> <li data-animal-type="spider">Tarantula</li> </ul> 浏览器支持 IE Firefox Ch…

jquery data属性 attr vs data

html5的自定义data属性相信大家都不会陌生,有了它你可以绑定所需的数据到指定元素上.然后通过jquery设置.获取数据,简直开心的不行啊.想到设置.获取元素属性值,大家一定首先想到了jquery的.attr()方法,但是你一定知道jquery还有个.data()的方法.本人以前一直萌(傻)萌(傻)哒(的)以为这两个方法在处理data属性过程中实现的效果是一样的,只不过.data()方法官方更推荐使用(看名字就感觉人家是正规军).但后来本人在做项目的过程中发现,这两种方法处理data属性并不…

HTML5 data属性

在HTML5中添加了data-*的方式来自定义属性,所谓data-*实际上上就是data-前缀加上自定义的属性名,命名可以用驼峰命名方式,但取值是必需全部使用小写,否则是undefinde 使用这样的结构可以进行数据存放.使用data-*可以解决自定义属性混乱无管理的现状. 小写 <div id="app" data-app="app">驼峰式 let cour = document.querySelector('#cour'); 获取data-的…

获取自定义data的几种属性

//获取data属性的几种方法 var id = this.getAttribute('data-id'); var id = $(this).attr('data-id'); var id = $(this).data('id'); var id = this.dataset["id"];…

html5 自定义数据属性，也就是 data-* 自定义属性---笔记。

html5 自定义数据属性 ,也就是 data-* 自定义属性. 例如 <div data-last-value="43" data-hidden="true" data-options='{"name":"John"}'></div> 可以有三种方法访问和修改data: 1.使用getAttribute setAttribute 方法例如 div.getAttr…

HTML 5：你必须知道的data属性

原文:All You Need to Know About the HTML5 Data Attribute 译文:你必须知道HTML 5 的Data属性译者:dwqs HTML 5的Data属性可以让你给元素自定义数据.这篇文章就是思考怎么更好的使用Data属性. 介绍 HTML 5之前,我们必须依赖于class和rel属性来存储需要在网站中使用的数据片段,这种做法有时会在网站的外观和实用性之间产生冲突.而HTML 5 Data属性的存在就能很好满足需要. 随着网站自身的数据越来越多,一些特…

如何使用HTML5自定义数据属性

在本文中,我将向你介绍如何使用HTML5自定义数据属性.我还将向你介绍一些开发人员在工作中经常使用的优秀实例. 为什么需要自定义数据属性? 很多时候我们需要存储一些与不同DOM元素相关联的信息.这些信息对于读者来说可能是不需要的,但是可以轻松的访问这些信息将会给我们开发者的工作带来极大的便利. 例如,假设你有一份某个餐饮类网站上所有餐馆的名单.在HTML5之前,如果你想存储餐馆提供的食物种类或餐馆与用户之间的距离等信息,那么你将使用HTML的class属性.但是如果你还需要存储餐馆的id以便查看…

html 5实用特性之data属性

HTML 5之前,我们必须依赖于class和rel属性来存储需要在网站中使用的数据片段,这种做法有时会在网站的外观和实用性之间产生冲突.而HTML 5 Data属性的存在就能很好满足需要. HTML5标准允许你在普通的元素标签里,嵌入类似data-*的属性,来实现一些简单数据的存取.它的数量不受限制,并且也能由javascript动态修改,也支持CSS选择器进行样式设置,jquery也提供了支持的支持.这使得data属性特别灵活,也非常强大.有了这样的属性我们能够更加有序直观的进行数据预设或存储…

JS组件系列——使用HTML标签的data属性初始化JS组件

前言:最近使用bootstrap组件的时候发现一个易用性问题,很多简单的组件初始化都需要在JS里面写很多的初始化代码,比如一个简单的select标签,因为仅仅只是需要从后台获取数据填充到option里面,可是从后台取数据就需要js的初始化,所以导致页面初始化的时候js的初始化代码里面出现很多重复的代码,看着很闹心.于是想起bootstrap table里面的data属性来,如果能够直接在html里面使用data-*这种方式来初始化简单的组件,那该多爽.我们先来看看bootstrap table的…

自定义Data Service Providers

自定义Data Service Providers 作者:AlexJ 翻译:谈少民原文链接:http://blogs.msdn.com/b/alexj/archive/2010/01/07/data-service-providers-getting-started.aspx 简介 Data Services 建立于 Data Service Provider(数据服务提供者)之上,他负责Data Service与数据源之间的通讯. Data Services内置了一些提供者,而且也允许你自定…

HTML5它contenteditable属性

HTML5它contenteditable属性 1.功能说明 (1)功能:同意用户编辑元素中的内容 (2)说明:是一个布尔值.false是不能编辑,true为可编辑 2.分析实例 (1)contenteditable属性为false <!DOCTYPE html> <head> <meta charset="utf-8" /> <title>contentEditable</title> </head> <u…

Android自定义XML属性以及遇到的命名空间的问题

转载请注明出处:http://www.cnblogs.com/kross/p/3458068.html 最近在做一些UI,很蠢很蠢的重复写了很多代码,比如一个自定义的UI Tab,由一个ImageView和一个TextView构成,如果不自定义属性的话,就需要单独new出几个Tab,然后分别给它们设置Drawable和Text.如果能使用XML属性的话,就直接在XML文件中就可以给Tab设置好Drawable和Text.Java中就可以少些几行代码. 网上看了好多例子,大部分内容都是大同小异,(…