html自定义data-*属性获取

注:在同一function中先赋值再取值的话用.data()取到的只是第一次加载时候的值,不是修改的值。

所以一般推荐用.attr()

1.给自定义属性data-num赋值

(1)  $("#id").attr("data-num",80)
(2)  $("#id").data("num",80)

2.获取自定义属性data-num的值

(1)   $("#id").attr("data-num")
(2)   $("#id").data("num")

3.获取select选择器的option的自定义属性data-num值

 var x = $("#selectid").find("option:selected").attr("data-num");
时间: 2024-08-01 10:18:44

html自定义data-*属性获取的相关文章

html自定义data属性

可以在HTML标签上添加任意以 "data-"开头的属性,这些属性页面上是不显示的,它不会影响到你的页面布局和风格,但它却是可读可写的. 例子:<div class="my-data" data-category="motion">test data</div> 如何读取自定义data属性数据呢? jquery已经有现成的方法: var myData = $(".my-data")data("

HTML5自定义data属性

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

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-* 属性用于存储页面或应用程序的私有自定义

jquery data属性 attr vs data

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

jquery的data()函数和html5的data属性

jquery的data()函数和html5的data属性:在html5中新增了一个自定义data属性,利用这个属性,可以添加任意的以"data-"开头的属性,这些属性不会再页面上显示,也不会影响任何原有的布局效果,并且此自定义属性是可读写的,例如: <div id="thediv" data-webname="蚂蚁部落">蚂蚁部落欢迎您</div> 以上代码就是使用自定义data属性的一个简单例子.可以使用jquery的d

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

HTML data属性

HTML标签可以添加自定义属性来存储和操作数据.但这样做会导致html语法上不符合Html规范.HTML5规范里增加了一个自定义data属性,自定义data属性的用法非常的简单,就可以往HTML标签上添加任意以 "data-"开头的属性,这些属性页面上是不显示的,它不会影响到你的页面布局和风格,但它却是可读可写的. 下面的一个代码片段是一个有效的HTML5标记: <div id="item" data-id='123'>11111</div>

Webkit IDL中自定义[命名]属性的获取(Getter)以及设置(Setter)函数

一.自定义命名属性的获取(Getter)以及设置(Setter)函数: [CustomNamedGetter](i), [CustomNamedSetter](i) 命名属性的W3C链接如下:?The spec of named properties (注意,下面描述的webkit行为和W3C的规范是不同的) 总结: [CustomNamedGetter] 或者 [CustomNamedSetter] 允许你为命名属性的getter或者setter编写自己的绑定函数. 用法如下: [ Custo

关于data属性的一些常见的处理方式

我们知道在html标签上通用的属性有以下这些: 1.title 2.class 3.id 4.name 5.data-属性名 6.style 这些东西大部分都有其各自的效用,这里就不一一多说. 在jQuery的attr与prop提到过在IE9之前版本中如果使用property不当会造成内存泄露问题,而且关于Attribute和Property的区别也让人十分头痛,在HTML5中添加了data-*的方式来自定义属性,所谓data-*实际上上就是data-前缀加上自定义的属性名,使用这样的结构可以进