最近幾天學(xué)習(xí)bootstrap有感，通過(guò)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代碼，就是通過(guò)data-api完成的，所以data-api就是框架當(dāng)中js完成特效的核心。可以通俗的理解為data-api就是一個(gè)普通的以data開頭的屬性，在js當(dāng)中我們可以通過(guò)這個(gè)data-api找到某個(gè)元素。

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)識(shí)可能不夠具體，或許還有些不成熟，請(qǐng)大家有宰相的肚子 <.>。原生的js和jQuery操作有少許差距，而且現(xiàn)在data-api對(duì)瀏覽器的兼容還是不是很完善，但也極大的減少了開發(fā)人員的工作量，還是值得推薦！如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)錯(cuò)新站長(zhǎng)站網(wǎng)站的支持！