Bootstrap 4 使用 e.relatedTarget 查找元素

Question

Hi trying to get data attr after e.relatedTarget in bootstrap's carusel.

$('#carouselExampleControls').on('slide.bs.carousel', function(e){
        target = e.relatedTarget

    });

when i do console.log got this

<div data-title="[555]" class="carousel-item active">
   <img class="d-block w-100" data-children="[ data-parent-id="" data-id="977" src="http://localhost/pics/8.png" alt="8.png">
   </div>

Trying to get data-title, type of this is object, tried with $.each not sure how to parse it.

Answer 1

To get the value of an attribute from any html element do the following:

var element = document.querySelector('.carousel-item.active');
var title = element.getAttribute('data-title');

considering your code, and using jquery:

$('#carouselExampleControls').on('slide.bs.carousel', function(e){
    var target = e.relatedTarget
    var title = $(target).attr('data-title'); // same as target.getAttribute('data-title');
});