data-toggleとは？

Question

data-toggleとは何のことでしょうか？
Bootstrapでタブの機能を有効化する際に、

<li class="nav-itam"><a href="#android" class="nav-link" data-toggle="tab">Android</a></li>``
というようdata-toggleが出てきました。classのようなものと考えて良いのでしょうか？

Answer 1

data-toggle="tab"

タブにつく「data-」から始まる属性はカスタムデータと呼ばれるユーザーが独自に拡張するための機能です
jsからだと.dataset[]で参照できます。
jQueryだと.data()で参照しますね。
ハイフンの使い方に若干注意が必要です

<script>
window.addEventListener('DOMContentLoaded', function(e){
  console.log(document.querySelector("#hoge").dataset["test"]);
  console.log(document.querySelector("#hoge").dataset["myTestData"]);
});
</script>
// jQuery
<script>
$(function(){
  console.log($("#hoge").data("test"));
  console.log($("#hoge").data("my-test-data"));
});
</script>
<div id="hoge" data-test="fuga" data-my-test-data="piyo">aaa</div>

Comments

[hakiriants]

カスタムデータというのですね。ありがとうございました。