Bootstrap中data-target 到底是什么


Posted in Javascript onFebruary 14, 2017

data-target 与data-toggle 还有data-spy 文档总是给人一种很突兀的方式给出来,然后又没有好好解释或者是我看的不够仔细?

HTML5允许开发者自由为其标签添加属性,这种自定义属性一般用“data-”开头。

我目前理解到在bootstrap中data-target,data-toggle等属性主要有两种作用:

【1.】在CSS中作标签选择器用。

如:

[data-toggle="buttons"] > .btn input[type="radio"],
[data-toggle="buttons"] > .btn-group > .btn input[type="radio"],
[data-toggle="buttons"] > .btn input[type="checkbox"],
[data-toggle="buttons"] > .btn-group > .btn input[type="checkbox"] {
 position: absolute;
 clip: rect(0, 0, 0, 0);
 pointer-events: none;
}

【2.】 用来传递替换文本(不知道是不是这么说),见下面的例子:

input[type=checkbox].ace.ace-switch + .lbl[data-lbl]::before {
 content: attr(data-lbl);
}

以上所述是小编给大家介绍的Bootstrap中data-target 到底是什么的全部叙述,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jquery ui 1.7 ui.tabs 动态添加与关闭(按钮关闭+双击关闭)
Apr 01 Javascript
检测jQuery.js是否已加载的判断代码
May 20 Javascript
解决jquery操作checkbox火狐下第二次无法勾选问题
Feb 10 Javascript
使用jQuery实现返回顶部
Jan 26 Javascript
45个JavaScript编程注意事项、技巧大全
Feb 11 Javascript
JavaScript处理解析JSON数据过程详解
Sep 11 Javascript
Prototype框架详解
Nov 25 Javascript
AnjularJS中$scope和$rootScope的区别小结
Sep 18 Javascript
JS实现颜色梯度与渐变效果完整实例
Dec 30 Javascript
js css自定义分页效果
Feb 24 Javascript
详解angularJS自定义指令间的相互交互
Jul 05 Javascript
react的滑动图片验证码组件的示例代码
Feb 27 Javascript
详解JS: reduce方法实现 webpack多文件入口
Feb 14 #Javascript
如何快速上手Vuex
Feb 14 #Javascript
BootStrap框架中的data-[ ]自定义属性理解(推荐)
Feb 14 #Javascript
Easyui Tree获取当前选择节点的所有顶级父节点
Feb 14 #Javascript
Vue组件开发初探
Feb 14 #Javascript
JavaScript Base64 作为文件上传的实例代码解析
Feb 14 #Javascript
JavaScript实现定时页面跳转功能示例
Feb 14 #Javascript
You might like
php设计模式 Visitor 访问者模式
2011/06/28 PHP
选择PHP作为网站开发语言的原因分享
2012/01/03 PHP
关于查看MSSQL 数据库 用户每个表 占用的空间大小
2013/06/21 PHP
PHP 字符串长度判断效率更高的方法
2014/03/02 PHP
php实现快速排序的三种方法分享
2014/03/12 PHP
php实现httpclient类示例
2014/04/08 PHP
javascript真的不难-回顾一下基础知识
2013/01/15 Javascript
jQuery进行组件开发完整实例
2015/12/15 Javascript
详解Node.js包的工程目录与NPM包管理器的使用
2016/02/16 Javascript
angularjs封装bootstrap时间插件datetimepicker
2016/06/20 Javascript
手机端js和html5刮刮卡效果
2020/09/29 Javascript
js中创建对象的几种方式
2017/02/05 Javascript
javascript实现文字无缝滚动效果
2017/08/26 Javascript
vue.js过滤器+ajax实现事件监听及后台php数据交互实例
2018/05/22 Javascript
Vue页面跳转动画效果的实现方法
2018/09/23 Javascript
20个必会的JavaScript面试题(小结)
2019/07/02 Javascript
vue父子组件的通信方法(实例详解)
2019/11/10 Javascript
原生JS与JQ获取元素的区别详解
2020/02/13 Javascript
[06:45]2018DOTA2亚洲邀请赛 4.5 SOLO赛 Sccc vs Maybe
2018/04/06 DOTA
python获取指定目录下所有文件名列表的方法
2015/05/20 Python
Python获取暗黑破坏神3战网前1000命位玩家的英雄技能统计
2016/07/04 Python
python距离测量的方法
2018/03/06 Python
django-rest-framework解析请求参数过程详解
2019/07/18 Python
python elasticsearch从创建索引到写入数据的全过程
2019/08/04 Python
Python3爬虫关于代理池的维护详解
2020/07/30 Python
python文件路径操作方法总结
2020/12/21 Python
使用HTML5拍照示例代码
2013/08/06 HTML / CSS
Html5之webcoekt播放JPEG图片流
2020/09/22 HTML / CSS
Nike香港官网:Nike HK
2019/03/23 全球购物
荷兰的时尚市场:To Be Dressed
2019/05/06 全球购物
我爱家乡演讲稿
2014/09/12 职场文书
党员群众路线剖析材料
2014/10/08 职场文书
MySQL连表查询分组去重的实现示例
2021/07/01 MySQL
深入理解CSS 中 transform matrix矩阵变换问题
2021/08/30 HTML / CSS
Python中with上下文管理协议的作用及用法
2022/03/18 Python
git中cherry-pick命令的使用教程
2022/06/25 Servers