Question

在我的代码中，我有：

<a class="choice" data-name="i_can_a_test_1">
    <img class="img-responsive" src="image.png" >
</a>
<a class="choice" data-name="i_can_a_test_2">
    <img class="img-responsive" src="image2.png" >
</a>

<table>
<tr><td name="i_can_a_test_1" id="name_cards">i_can_a_test_1</td></tr>
<tr><td name="i_can_a_test_2" id="name_cards">i_can_a_test_2</td></tr>
<tr><td name="cant_a_test_1" id="name_cards">cant_a_test_2</td></tr>
</table>

但现在我想：如果相同，请为所有i_can_a_test_*

添加课程

$('body').on("click",".choice", function(){

    var same_text = $(this).data('name').slice(0,6);        
    var same = $( 'td[name^='+same_text+']' ).length;

     **if same, add class for all "i_can_a_test_*"**
 });

你知道我怎么做吗？每个人都认为。

Answer 1

[...document.getElementsByClassName("*")].filter(e=>e.textContent.split("i_can_a_test_")[1]).forEach(e=>e.ClassName+=" someclass");

这就是你所要求的。然而，这是不好的风格......

Answer 2

将id =“name_cards”更改为class：

$('body').on('click', '.choice', function(e) {
  var name = $(this).data('name').substr(0,6)
    , $cards = $('.name_cards')
    ;
  $cards
    .removeClass('red')
    .filter('[name^="'+name+'"]')
    .addClass('red')
    ;
});

http://codepen.io/anon/pen/YNGqEQ

Answer 3

您可以使用属性以选择器开头来实现。

此处：http://api.jquery.com/attribute-starts-with-selector/

$('body').on("click",".choice", function(){

  var same = $(this).data('name').slice(0,13);   
  $('td[name^=' + same + ']').addClass('myClass');

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a class="choice" data-name="i_can_a_test_1">
    <img class="img-responsive" src="image.png"/>
</a>
<a class="choice" data-name="i_can_a_test_2">
    <img class="img-responsive" src="image2.png"/>
</a>

<table>
  <tr><td name="i_can_a_test_1">i_can_a_test_1</td></tr>
  <tr><td name="i_can_a_test_2">i_can_a_test_2</td></tr>
  <tr><td name="cant_a_test_1">cant_a_test_2</td></tr>
</table>

为所有相同的文本添加类

3 个答案: