ループテーブルを通って、特定のクラスの属性をフェッチのみ

Question

これは私のテーブルであり、どのように私はクラスのビデオ-IDnewvideosのみ

<table class="mytable2 table" id="videosexistingtable"> 
    <tbody class="connectedSortable ui-sortable"> 
     <tr> 
     <th>Name</th> 
     <th>Video</th> 
     </tr> 
     <tr video-id="6" tag-id="1" class="newvideos" style="display: table-row;"> 
     <td>Video1</td> 
     <td>Data Science</td> 
     </tr> 
     <tr class="existingvideos" video-id="2"> 
     <td>Video2</td> 
     <td>Data Science</td> 
     </tr> 
     <tr video-id="49" tag-id="1" class="newvideos" style="display: table-row;"> 
     <td>Video49</td> 
     <td>Data Science</td> 
     </tr> 
     <tr video-id="48" tag-id="1" class="newvideos" style="display: table-row;"> 
     <td>Video48</td> 
     <td>Data Science</td> 
     </tr> 
    </tbody> 
</table> 

$(document).ready(function() { 
    getallnewvideos(); 
}); 

function getallnewvideos() { 
    $("#videosexistingtable > tbody > tr .newvideos").each(function() { 
     var video_id = $(this).attr('video-id'); 
     console.log('video_id' + video_id); 
    }); 
} 

を得ることができますこれは私のバイオリンです：http://jsfiddle.net/cod7ceho/161/

どうすればいいか教えてください。

Answer 1

最初にvideo-idは、tr要素の有効な属性ではありません。要素にカスタムデータを格納するには、data-*属性を使用します。

そこからは、セレクタに問題があります。trと.newvideosの間にスペースは必要ありません。これを試してみてください：

$(document).ready(function() { 
 
    getallnewvideos(); 
 
}); 
 

 
function getallnewvideos() { 
 
    $("#videosexistingtable > tbody > tr.newvideos").each(function() { 
 
    var video_id = $(this).data('video-id'); // Note the use of data() here 
 
    console.log('video_id: ' + video_id); 
 
    }); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table class="mytable2 table" id="videosexistingtable"> 
 
    <tbody class="connectedSortable ui-sortable"> 
 
    <tr> 
 
     <th>Name</th> 
 
     <th>Video</th> 
 
    </tr> 
 
    <tr data-video-id="6" data-tag-id="1" class="newvideos"> 
 
     <td>Video1</td> 
 
     <td>Data Science</td> 
 
    </tr> 
 
    <tr data-video-id="2" class="existingvideos"> 
 
     <td>Video2</td> 
 
     <td>Data Science</td> 
 
    </tr> 
 
    <tr data-video-id="49" data-tag-id="1" class="newvideos"> 
 
     <td>Video49</td> 
 
     <td>Data Science</td> 
 
    </tr> 
 
    <tr data-video-id="48" data-tag-id="1" class="newvideos"> 
 
     <td>Video48</td> 
 
     <td>Data Science</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

また、あなたがmap()を使用してvideo-idの配列を構築することができます。

var arr = $("#videosexistingtable > tbody > tr.newvideos").map(function() { 
    return $(this).data('video-id'); 
}).get(); 

Answer 2

あなたはTRとの間にスペースを削除する必要があります。 newvideos

$("#videosexistingtable > tbody > tr.newvideos").each(function() 
    { 
     var video_id = $(this).attr('video-id'); 
     console.log('video_id'+video_id); 
    }); 

Answer 3

あなたは近すぎます。スクリプト行でほんの少しの誤差が

$("#videosexistingtable > tbody > tr.newvideos").each(function() 

それは「tr.newvideos」間違いはここに細かい作業