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 相关文章推荐
javascript实现表单验证
Jan 29 Javascript
jQuery实现漂亮实用的商品图片tips提示框效果(无图片箭头+阴影)
Apr 16 Javascript
jquery对象访问是什么及使用方法介绍
May 03 Javascript
一道优雅面试题分析js中fn()和return fn()的区别
Jul 05 Javascript
JS控制静态页面之间传递参数获取参数并应用的简单实例
Aug 10 Javascript
jQuery表单事件实例代码分享
Aug 18 Javascript
JS DOMReady事件的六种实现方法总结
Nov 23 Javascript
jquery实现刷新随机变化样式特效(tag标签样式)
Feb 03 Javascript
tablesorter.js表格排序使用方法(支持中文排序)
Feb 10 Javascript
vue模板语法-插值详解
Mar 06 Javascript
解决layui弹框失效的问题
Sep 09 Javascript
JavaScript或jQuery 获取option value值方法解析
May 12 jQuery
详解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的十大要点(上)
2009/02/04 PHP
在字符串指定位置插入一段字符串的php代码
2010/02/16 PHP
PHP的关于变量和日期处理的一些面试题目整理
2015/08/10 PHP
PHP+MariaDB数据库操作基本技巧备忘总结
2018/05/21 PHP
Prototype Date对象 学习
2009/07/12 Javascript
基于Jquery制作的幻灯片图集效果打包下载
2011/02/12 Javascript
使用jQuery实现dropdownlist的联动效果(sharepoint 2007)
2011/03/30 Javascript
javascript window.confirm确认 取消对话框实现代码小结
2012/10/21 Javascript
用js编写的简单的计算器代码程序
2015/08/04 Javascript
jquery+ajax请求且带返回值的代码
2015/08/12 Javascript
jquery动画效果学习笔记(8种效果)
2015/11/13 Javascript
详解jQuery事件
2017/01/13 Javascript
老生常谈js中的MVC
2017/07/25 Javascript
React Native之prop-types进行属性确认详解
2017/12/19 Javascript
微信小程序性能优化之checkSession的使用
2019/03/06 Javascript
jQuery操作cookie的示例代码
2019/06/05 jQuery
[49:13]DOTA2上海特级锦标赛C组资格赛#1 OG VS LGD第一局
2016/02/27 DOTA
[42:52]IG vs VGJ.T 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
python合并文本文件示例
2014/02/07 Python
pygame学习笔记(5):游戏精灵
2015/04/15 Python
python绘制双柱形图代码实例
2017/12/14 Python
Python2.7下安装Scrapy框架步骤教程
2017/12/22 Python
python中从str中提取元素到list以及将list转换为str的方法
2018/06/26 Python
对pandas写入读取h5文件的方法详解
2018/12/28 Python
python 使用while写猜年龄小游戏过程解析
2019/10/07 Python
python3+openCV 获取图片中文本区域的最小外接矩形实例
2020/06/02 Python
使用CSS3在触屏上为按钮实现激活效果
2013/09/27 HTML / CSS
HTML5 Canvas绘制文本及图片的基础教程
2016/03/14 HTML / CSS
美国电子元器件分销商:Newark element14
2018/01/13 全球购物
美国和加拿大计算机和电子产品购物网站:TigerDirect.com
2019/09/13 全球购物
优秀求职信范文分享
2013/12/19 职场文书
公司授权委托书格式样本
2014/10/01 职场文书
2014年党支部书记工作总结
2014/12/04 职场文书
什么是执行力?9个故事告诉您:成功绝非偶然!
2019/07/05 职场文书
Redis高级数据类型Hyperloglog、Bitmap的使用
2021/05/24 Redis
Vue2项目中对百度地图的封装使用详解
2022/06/16 Vue.js