BootStrap框架中的data-[ ]自定義屬性理解(推薦)
最近幾天學(xué)習(xí)bootstrap有感，通過data-api可以使用所有的bootstrap插件，不用寫一行js代碼，方便了很多，是我們的首選方式。
為什么bootstrap的插件當(dāng)中出現(xiàn)很多data-api，因?yàn)槲覀兺ǔＴ谑褂胋ootstrap框架的時(shí)候需要引入的是bootstrap.css,bootstrap.js,以及jQuery.js,然后我們之所以不用寫一點(diǎn)js代碼就可以使用特效豐富的bootstrap框架，原因就是bootstrap.js已經(jīng)幫我們完成了所有的js代碼，就是通過data-api完成的，所以data-api就是框架當(dāng)中js完成特效的核心?？梢酝ㄋ椎睦斫鉃?code>data-api就是一個普通的以data開頭的屬性，在js當(dāng)中我們可以通過這個data-api找到某個元素。
jquery操作data-api的方法：
示例
<div data-support = "pc"></div>
<script>
//獲取support值
console.log($('div').data('support'));
//設(shè)置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);
//設(shè)置support值
support.dataset.support = "mobile_device";
</script>
第一次寫文檔，新手上路，認(rèn)識可能不夠具體，或許還有些不成熟，請大家有宰相的肚子 <.>。原生的js和jQuery操作有少許差距，而且現(xiàn)在data-api對瀏覽器的兼容還是不是很完善，但也極大的減少了開發(fā)人員的工作量，還是值得推薦！如果大家有任何疑問請給我留言，小編會及時(shí)回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
- Bootstrap中data-target 到底是什么
- bootstrap jquery dataTable 異步ajax刷新表格數(shù)據(jù)的實(shí)現(xiàn)方法
- DataTables+BootStrap組合使用Ajax來獲取數(shù)據(jù)并且動態(tài)加載dom的方法（排序，過濾，分頁等）
- 基于SpringMVC+Bootstrap+DataTables實(shí)現(xiàn)表格服務(wù)端分頁、模糊查詢
- 利用ASP.NET MVC和Bootstrap快速搭建個人博客之后臺dataTable數(shù)據(jù)列表
- bootstrap data與jquery .data
- Bootstrap 中data-[*] 屬性的整理
相關(guān)文章
JavaScript Html實(shí)現(xiàn)移動端紅包雨功能頁面
這篇文章主要為大家詳細(xì)介紹了JavaScript Html實(shí)現(xiàn)移動端紅包雨功能頁面，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-01-01
這篇文章主要為大家介紹了JavaScript原型對象的this指向問題，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2021-11-11
這篇文章主要為大家詳細(xì)介紹了JavaScript分頁組件使用方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-07-07
javascript 密碼框防止用戶粘貼和復(fù)制的實(shí)現(xiàn)代碼
本篇文章主要是對javascript 密碼框防止用戶粘貼和復(fù)制的實(shí)現(xiàn)代碼進(jìn)行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助2014-02-02
Bootstrap基本插件學(xué)習(xí)筆記之Alert警告框(20)
這篇文章主要為大家詳細(xì)介紹了Bootstrap基本插件學(xué)習(xí)筆記之ALert警告框的相關(guān)資料,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-12-12
這篇文章主要介紹了使用原生JS實(shí)現(xiàn)彈出層特效,需要的朋友可以參考下2014-12-12
這篇文章是小編日常收集整理的有關(guān)bootstrap?常用組件包括Bootstrap?面板（Panels），Bootstrap?多媒體對象（Media?Object）知識，非常不錯，需要的朋友參考下吧2017-03-03
JS實(shí)現(xiàn)跟隨鼠標(biāo)的鏈接文字提示框效果
這篇文章主要介紹了JS實(shí)現(xiàn)跟隨鼠標(biāo)的鏈接文字提示框效果,涉及javascript鼠標(biāo)事件及頁面元素樣式操作的相關(guān)技巧,非常簡單實(shí)用,需要的朋友可以參考下2015-08-08
微信小程序點(diǎn)擊view動態(tài)添加樣式過程解析
這篇文章主要介紹了微信小程序點(diǎn)擊view動態(tài)添加樣式過程解析,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-01-01
JavaScript時(shí)間對象Date內(nèi)置構(gòu)造函數(shù)操作實(shí)例
這篇文章主要為大家介紹了JavaScript時(shí)間對象Date內(nèi)置構(gòu)造函數(shù)操作實(shí)例，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-05-05