獲取屬性值

我有html如下。獲取屬性值

<div class="testimonials-list"> 
    <div class="slider testimonials-list-slider" data-index="0"> 
    <div class="testi-list tr-slide"> 
      <p>As the clock struck midnight on Chaitra Vadi</p> 
    </div> 
    <div class="testi-list tr-slide" tr-active data-index="1"> 
     <p>the kingdom of Pundarikgiri in Mahavideh Kshetra,.</p> 
    </div> 
    <div class="testi-list tr-slide" data-index="2"> 
     <p>3 shetra, a beautiful baby a Taurus on his body was bor</p> 
    </div> 
    </div> 
</div>

我想要得到的活性的div（即TR-活性類），然後要訪問屬性「數據索引」的值。我們如何使用jQuery來做到這一點？

var i = $('.testi-list').find('tr-active').attr('data-index');

上方行不行。

來源

2017-01-31 ghetal

TR-活性是不是被添加作爲一個屬性類。你能證實嗎？ – Sharmila

1.在你寫的問題中，'tr-active'是一個類，但是在標記中它是一個屬性2.'.find（'tr-active'）'尋找''元素 – Andreas

oops ... tr -active是一個類.... – ghetal

試試這個，你可以做到這一點像$('.testi-list.tr-active').attr('data-index');

$(function(){ 
 

 
var i = $('.tr-active').attr('data-index'); 
 

 
alert(i); 
 
});

\t <div class="testimonials-list"> 
 
    <div class="slider testimonials-list-slider" data-index="0"> 
 
    <div class="testi-list tr-slide"> 
 
      <p>As the clock struck midnight on Chaitra Vadi</p> 
 
    </div> 
 
    <div class="testi-list tr-slide tr-active" data-index="1"> 
 
     <p>the kingdom of Pundarikgiri in Mahavideh Kshetra,.</p> 
 
    </div> 
 
    <div class="testi-list tr-slide" data-index="2"> 
 
     <p>3 shetra, a beautiful baby a Taurus on his body was bor</p> 
 
    </div> 
 
    </div> 
 
</div> 
 

 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

來源

2017-01-31 10:32:48

$(function(){ 
 

 
var i = $("[tr-active]").attr("data-index"); 
 

 
alert(i); 
 
});

\t <div class="testimonials-list"> 
 
<div class="slider testimonials-list-slider" data-index="0"> 
 
<div class="testi-list tr-slide"> 
 
     <p>As the clock struck midnight on Chaitra Vadi</p> 
 
</div> 
 
<div class="testi-list tr-slide" tr-active data-index="1"> 
 
    <p>the kingdom of Pundarikgiri in Mahavideh Kshetra,.</p> 
 
</div> 
 
<div class="testi-list tr-slide" data-index="2"> 
 
    <p>3 shetra, a beautiful baby a Taurus on his body was bor</p> 
 
</div> 
 
</div> 
 
</div> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

來源

2017-01-31 10:35:01

這將工作，無需更改任何內容（保持「tr-active」屬性而不是將其轉換爲類） –

你的HTML應該是這樣..

<div class="testimonials-list"> 
    <div class="slider testimonials-list-slider" data-index="0"> 
    <div class="testi-list tr-slide"> 
      <p>As the clock struck midnight on Chaitra Vadi</p> 
    </div> 
    <div class="testi-list tr-slide tr-active" data-index="1"> 
     <p>the kingdom of Pundarikgiri in Mahavideh Kshetra,.</p> 
    </div> 
    <div class="testi-list tr-slide" data-index="2"> 
     <p>3 shetra, a beautiful baby a Taurus on his body was bor</p> 
    </div> 
    </div> 
</div>

tr-active類不在引號內，所以它作爲一個屬性起作用。

也用它來尋找數據索引

$('.testi-list.tr-active').attr('data-index');

來源

2017-01-31 10:35:57 Minksmnm

這將做的工作對你

$('div[tr-active]').data("index")

演示：從數據屬性https://jsfiddle.net/rhsxfmcL/

來源

2017-01-31 10:36:34

找到解決方案。

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
<div class="testimonials-list"> 
 
    <div class="slider testimonials-list-slider" data-index="0"> 
 
    <div class="testi-list tr-slide"> 
 
      <p>As the clock struck midnight on Chaitra Vadi</p> 
 
    </div> 
 
    <div class="testi-list tr-slide tr-active" data-index="1"> 
 
     <p>the kingdom of Pundarikgiri in Mahavideh Kshetra,.</p> 
 
    </div> 
 
    <div class="testi-list tr-slide" data-index="2"> 
 
     <p>3 shetra, a beautiful baby a Taurus on his body was bor</p> 
 
    </div> 
 
    </div> 
 
<script src="https://code.jquery.com/jquery-3.1.0.js"></script> 
 
    <script> 
 
    var i = $('.tr-active').data("index"); 
 
    alert(i); 
 
    </script> 
 
</div> 
 
</body> 
 
</html>

來源

2017-01-31 10:37:26 Ranjith

回答

相關問題