最近几天学习bootstrap有感，通过data-api可以使用所有的bootstrap插件，不用写一行js代码，方便了很多，是我们的首选方式。

为什么bootstrap的插件当中出现很多data-api，因为我们通常在使用bootstrap框架的时候需要引入的是bootstrap.css,bootstrap.js,以及jQuery.js,然后我们之所以不用写一点js代码就可以使用特效丰富的bootstrap框架，原因就是bootstrap.js已经帮我们完成了所有的js代码，就是通过data-api完成的，所以data-api就是框架当中js完成特效的核心。可以通俗的理解为data-api就是一个普通的以data开头的属性，在js当中我们可以通过这个data-api找到某个元素。

jquery操作data-api的方法：

示例

<div data-support = "pc"></div>
  <script>
  //获取support值
  console.log($('div').data('support'));
  //设置support值
  $('div').data('support','mobile_divice');
  </script>

原生js操作data-api的方法：

示例

<div data-support = "pc" id = "support_device "></div>
  <script>
  var support = document.getElementsById("support_device");
  //获取support值

  console.log(support.dataset.support);
  //设置support值
  support.dataset.support = "mobile_device";
    </script>

第一次写文档，新手上路，认识可能不够具体，或许还有些不成熟，请大家有宰相的肚子 <.>。原生的js和jQuery操作有少许差距，而且现在data-api对浏览器的兼容还是不是很完善，但也极大的减少了开发人员的工作量，还是值得推荐！如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对网站的支持！

# bootstrap  # 自定义属性  # bootstrap框架  # Bootstrap中data-target 到底是什么  # bootstrap jquery dataTable 异步ajax刷新表格数据的实现方法  # DataTables+BootStrap组合使用Ajax来获取数据并且动态加载dom的方法（排序  # 过滤  # 分页等）  # 基于SpringMVC+Bootstrap+DataTables实现表格服务端分页、模糊查询  # 利用ASP.NET MVC和Bootstrap快速搭建个人博客之后台dataTable数据列表  # bootstrap data与jquery .data  # Bootstrap 中data-[*] 属性的整理  # 的是  # 在此  # 不是很  # 请大家  # 我们可以  # 但也  # 可以使用  # 开发人员  # 小编  # 不成熟  # 给我留言  # 一个普通  # 感谢大家  # 就可以  # 便了  # 最近几天  # 疑问请  # 有任何  # 完成了  # 文档 

相关栏目： 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571 】

相关推荐： Laravel怎么实现验证码(Captcha)功能  Laravel如何使用软删除（Soft Deletes）功能_Eloquent软删除与数据恢复方法  Laravel如何实现文件上传和存储？（本地与S3配置）  长沙企业网站制作哪家好,长沙水业集团官方网站？  Laravel怎么实现模型属性转换Casting_Laravel自动将JSON字段转为数组【技巧】  Laravel怎么上传文件_Laravel图片上传及存储配置  网站优化排名时，需要考虑哪些问题呢？  Win11怎么关闭专注助手 Win11关闭免打扰模式设置【操作】  微信小程序 canvas开发实例及注意事项  再谈Python中的字符串与字符编码（推荐）  Laravel如何使用Passport实现OAuth2？（完整配置步骤）  魔毅自助建站系统：模板定制与SEO优化一键生成指南  专业商城网站制作公司有哪些,pi商城官网是哪个？  教你用AI润色文章，让你的文字表达更专业  JavaScript模板引擎Template.js使用详解  html5如何设置样式_HTML5样式设置方法与CSS应用技巧【教程】  专业企业网站设计制作公司,如何理解商贸企业的统一配送和分销网络建设？  Java Adapter 适配器模式（类适配器，对象适配器）优缺点对比  linux top下的 minerd 木马清除方法  Python高阶函数应用_函数作为参数说明【指导】  Laravel如何实现模型的全局作用域？（Global Scope示例）  怎么用AI帮你设计一套个性化的手机App图标？  微信小程序 require机制详解及实例代码  如何构建满足综合性能需求的优质建站方案？  详解Android——蓝牙技术 带你实现终端间数据传输  如何做网站制作流程,*游戏网站怎么搭建？  Laravel Telescope怎么调试_使用Laravel Telescope进行应用监控与调试  Laravel怎么多语言本地化设置_Laravel语言包翻译与Locale动态切换【手册】  如何在搬瓦工VPS快速搭建网站？  Laravel如何实现本地化和多语言支持_Laravel多语言配置与翻译文件管理  Python自动化办公教程_ExcelWordPDF批量处理案例  Laravel如何集成微信支付SDK_Laravel使用yansongda-pay实现扫码支付【实战】  深圳网站制作设计招聘,关于服装设计的流行趋势，哪里的资料比较全面？  详解Huffman编码算法之Java实现  为什么要用作用域操作符_php中访问类常量与静态属性的优势【解答】  Laravel Eloquent：优雅地将关联模型字段扁平化到主模型中  Swift开发中switch语句值绑定模式  ChatGPT 4.0官网入口地址 ChatGPT在线体验官网  如何批量查询域名的建站时间记录？  如何确保西部建站助手FTP传输的安全性？  专业型网站制作公司有哪些,我设计专业的，谁给推荐几个设计师兼职类的网站？  Laravel怎么做缓存_Laravel Cache系统提升应用速度的策略与技巧  Edge浏览器提示“由你的组织管理”怎么解决_去除浏览器托管提示【修复】  EditPlus中的正则表达式实战(5)  Python企业级消息系统教程_KafkaRabbitMQ高并发应用  如何在 Pandas 中基于一列条件计算另一列的分组均值  Laravel事件和监听器如何实现_Laravel Events & Listeners解耦应用的实战教程  Laravel Admin后台管理框架推荐_Laravel快速开发后台工具  Laravel PHP版本要求一览_Laravel各版本环境要求对照  制作企业网站建设方案,怎样建设一个公司网站？