Qu'est-ce que le " data-target` attribut dans le Bootstrap 3?

Pouvez-vous me dire quel est le système ou le comportement derrière le data-target attribut utilisé par Bootstrap 3?

Je sais que les données-activer l'habitude de viser l'API JavaScript de Bootstrap de fonctionnalités graphiques.

InformationsquelleAutor darkomen | 2014-02-21
  1. 97

    data-target est utilisé par bootstrap pour rendre votre vie plus facile. Vous (la plupart) n'ont pas besoin d'écrire une seule ligne de Javascript pour utiliser leur pré-faites Les composants JavaScript.

    La data-target attribut doit contenir un sélecteur CSS qui pointe vers l'Élément HTML qui sera changé.

    Modal Exemple de Code à partir de BS3:

    <!-- Button trigger modal -->
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
  Launch demo modal
</button>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  [...]
</div>

    Dans cet exemple, le bouton a data-target="#myModal", si vous cliquez dessus, <div id="myModal">...</div> sera modifié (dans ce cas décoloré).
    Cela se produit parce que #myModal dans les sélecteurs CSS points pour les éléments qui ont une id attribut avec le myModal valeur.

    De plus amples informations sur le HTML5 "données" de l'attribut: https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributes

    • c'est comme un sélecteur CSS moteur et rien d'autre ?
    • exactement, pas comme. data-target accepte un sélecteur CSS qui pointe vers l'élément concerné.
    InformationsquelleAutor Pascalmh
  2. 15

    La bascule dit Bootstrap quoi faire et la cible indique Bootstrap élément qui va ouvrir. Donc, chaque fois qu'un lien comme ça, c'est cliqué, un modal avec un id de “basicModal” apparaîtra.

    InformationsquelleAutor user3098847