Selecting attributes from Bootstrap

Asked

Viewed 126 times

1

Well, I’m having trouble selecting an attribute from a certain element of bootstrap with the jquery, for example:

<ol class="carousel-indicators">
    <li data-target="#carrossel-principal" data-slide-to="0" class="active"></li>
    <li data-target="#carrossel-principal" data-slide-to="1"></li>
    <li data-target="#carrossel-principal" data-slide-to="2"></li>
</ol>
  • To select the data-target, or data-slide-to, and their respective values, how such a procedure could be done ?
  • The same procedure is valid for any other attribute ?
  • How can I take the value only of data-slide-to classy active ?

2 answers

3


See if it solves:

$('.carousel-indicators li').data('slide-to');
$('.carousel-indicators').data('target');

Putting data the way you put it into HTML, it works.

  • but for example, how can I take the value of data who is with the active class ?

  • 1

    Using $('li.active').data();

  • perfect guy, worked quietly

2

DATA ATTRIBUTES

Adding attributes with data (Data Attributes) aims at the extensibility of HTML5 tags. Attributes can be accessed in two ways, via pure Javascript or jQuery.

With pure Javascript via dataset (SOURCE):

function mostrar() {
alert(document.getElementById('elemento').dataset.codigo);
}

/* Repare no uso do DATASET pois é ele que te permite acessar qualquer valor do tipo data-??? */
<p data-codigo="18" onclick="mostrar()" id="elemento">Clique aqui!</div>

And with jQuery via .data() (SOURCE):

$('div').click(function() {
  alert($('div').data('qualquer'));
});

/* a função .data() permite capturar atributos data- */
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div data-qualquer="Trabalhando com data-">Clique Aqui!</div>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.