Jquery 操作HTML5自定义属性data-*

新的HTML5标准允许你在普通的元素标签里,嵌入类似data-*的属性,来实现一些简单数据的存取.它的数量不受限制,并且也能由javascript动态修改,也支持CSS选择器进行样式设置.这使得data属性特别灵活,也非常强大.有了这样的属性我们能够更加有序直观的进行数据预设或存储.下面介绍HTML5 Dataset 存储的实际应用,以及包括jQuery在内的四种存取方式. HTML5 Dataset 存储的例子 为一个元素分配data属性存储数据,例如这是一个span元素,它的内容是一首音乐的

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

我们先看下$.fn.data()的使用,这个和$.data()是不一样的,前者是和某个jquery对象相关,后者则是全局方法.主要有data()和removeData()这2个实例方法.通过下面的例子和执行结果可以看到:$.fn.data()和$.fn.removeData()跟$.data的使用方式没有什么差别. // 支持任何数据类型 2. $( "body" ).data( "name", "xx" ); 3. $( "body&

p.p1 { margin: 0.0px 0.0px 2.0px 0.0px; font: 14.0px ".PingFang SC" } p.p2 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px ".PingFang SC" } p.p3 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px "Helvetica Neue" } p.p4 { margin

JQuery操作标签 一.样式操作 1 添加指定的CSS类名 addClass(); 2 移除指定的CSS类名 removeClass(); // 与addClass一起连用实现开关 3 判断样式存不存在 hasClass(); // true //false 4 切换CSS类名,如果有就移除,如果没有就添加 toggleClass(); // 实现删除和动态添加 5 CSS操作 $("选择器").css(样式) 二.位置操作 1 获取匹配元素在当前窗口的相对偏移或设置元素位置 off

原文转自HTML5自定义属性对象Dataset简介 一.html5 自定义属性介绍 之前翻译的“你必须知道的28个HTML5特征.窍门和技术”一文中对于HTML5中自定义合法属性data-已经做过些介绍,就是在HTML5中我们可以使用data-前缀设置我们需要的自定义属性,来进行一些数据的存放,例如我们要在一个文字按钮上存放相对应的id: <a href="javascript:" data-id="2312">测试</a> 这里的data-

一.html5 自定义属性介绍 之前翻译的“你必须知道的28个HTML5特征.窍门和技术”一文中对于HTML5中自定义合法属性data-已经做过些介绍,就是在HTML5中我们可以使用data-前缀设置我们需要的自定义属性,来进行一些数据的存放,例如我们要在一个文字按钮上存放相对应的id: 测试 这里的data-前缀就被称为data属性,其可以通过脚本进行定义,也可以应用CSS属性选择器进行样式设置.数量不受限制,在控制和渲染数据的时候提供了非常强大的控制. 二.Dataset基础 下面是元素应用

技术非常多,样例非常多.仅仅好慢慢学,慢慢实践!!如今学的这本书是[JavaScript实战----JavaScript.jQuery.HTML5.Node.js实例大全] JavaScript.jQuery.HTML5.Node.js实例大全-读书笔记2 3.3 响应鼠标动作 图3-2的效果已经有了,须要鼠标来操作展示想看的照片.这就须要在对应的地方加上事件. 3.3.1 响应小照片单击动作 在3.2.3的代码里提供了显示小图列表的eg.showThumb()方法.在单击小图片时要显示大图片.

操作DOM1 为什么用jQuery 操作DOM节点啦! 不需要考虑浏览器兼容性问题,全部统一操作! 修改Text和HTML jQuery对象的text():返回节点的文本 html():原始HTML文本 $('#test-ul li[name=book]').text(); // $('#test-ul li[name=book]').html(); // text()不传参数:获取文本 text()传参数:设置文本 html()类似 $('#test-ul li[name=book]').te