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 相关文章推荐
基于prototype的validation.js发布2.3.4新版本,让你彻底脱离表单验证的烦恼
Dec 06 Javascript
jQuery autocomplete插件修改
Apr 17 Javascript
JSDoc 介绍使用规范JsDoc的使用介绍
Feb 12 Javascript
javascript 运算数的求值顺序
Aug 23 Javascript
jQuery插件ajaxFileUpload实现异步上传文件效果
Apr 14 Javascript
JavaScript中闭包的写法和作用详解
Jun 29 Javascript
jQuery展示表格点击变色、全选、删除
Jan 05 Javascript
浅谈js中的变量名和函数名重名
Feb 13 Javascript
使用vue构建一个上传图片表单
Jul 04 Javascript
vue使用keep-alive实现数据缓存不刷新
Oct 21 Javascript
移动端H5页面返回并刷新页面(BFcache)的方法
Nov 06 Javascript
JavaScript使用canvas绘制坐标和线
Apr 28 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
vs中通过剪切板循环来循环粘贴不同内容
2011/04/30 PHP
ThinkPHP控制器详解
2015/07/27 PHP
php简单统计中文个数的方法
2016/09/30 PHP
PHP对象相关知识总结
2017/04/09 PHP
PHP通过GD库实现验证码功能示例
2019/02/23 PHP
Laravel6.0.4中将添加计划任务事件的方法步骤
2019/10/15 PHP
fckeditor 获取文本框值的实现代码
2009/02/09 Javascript
深入认识javascript中的eval函数
2009/11/02 Javascript
extjs每个组件要设置唯一的ID否则会出错
2014/06/15 Javascript
纯HTML5制作围住神经猫游戏-附源码下载
2015/08/23 Javascript
javascript之Array 数组对象详解
2016/06/07 Javascript
Bootstrap图片轮播组件Carousel使用方法详解
2016/10/20 Javascript
js读取json文件片段中的数据实例
2017/03/09 Javascript
AngularJs 最新验证手机号码的实例,成功测试通过
2017/11/26 Javascript
vue权限问题的完美解决方案
2019/05/08 Javascript
vue中npm包全局安装和局部安装过程
2019/09/03 Javascript
简述Vue中容易被忽视的知识点
2019/12/09 Javascript
微信小程序实现自定义底部导航
2020/11/18 Javascript
python实现DNS正向查询、反向查询的例子
2014/04/25 Python
Python中用于返回绝对值的abs()方法
2015/05/14 Python
详解python中的 is 操作符
2017/12/26 Python
TensorFLow用Saver保存和恢复变量
2018/03/10 Python
Pandas中把dataframe转成array的方法
2018/04/13 Python
python实现扫描日志关键字的示例
2018/04/28 Python
Python turtle画图库&&画姓名实例
2020/01/19 Python
Python如何进行时间处理
2020/08/06 Python
美体小铺瑞典官方网站:The Body Shop瑞典
2018/01/27 全球购物
Magee 1866官网:Donegal粗花呢外套和大衣专家
2019/11/01 全球购物
Linux常见面试题
2013/03/18 面试题
职专应届生求职信
2013/11/16 职场文书
消防器材管理制度
2014/01/28 职场文书
2014年学校教学工作总结
2014/12/06 职场文书
家长意见和建议怎么写
2015/06/04 职场文书
教师素质教育心得体会
2016/01/19 职场文书
python 实现体质指数BMI计算
2021/05/26 Python
elasticSearch-api的具体操作步骤讲解
2021/06/28 Java/Android