如何更改選擇器：包含完全匹配一個？

Question

我有一個線

$('#custom-table tr > td:nth-child(1):contains('+val+')').closest('tr').show();

，想找到一種方法，具有相同或精確匹配，而不是包含。

Answer 1

您可以使用filter()和text()

var val = 'abc'; 
 
$('#custom-table tr > td:nth-child(1)').filter(function() { 
 
    return $.trim($(this).text()) == val; 
 
    // get text content using text() and compare 
 
    // and use $.trim() for removing whitespace from the beginning and end of a string. 
 
}).closest('tr').show();

#custom-table tr { 
 
    display: none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<table id="custom-table"> 
 
    <tr> 
 
    <td>abc</td> 
 
    <td>absc</td> 
 
    </tr> 
 
    <tr> 
 
    <td>abcd</td> 
 
    <td>abcd</td> 
 
    </tr> 
 
    <tr> 
 
    <td>abc</td> 
 
    <td>absc</td> 
 
    </tr> 
 
    <tr> 
 
    <td>abcd</td> 
 
    <td>abcd</td> 
 
    </tr> 
 
</table>

更新：對於完全相同的行爲

var val = 'abc'; 
 
$('#custom-table tr > td:nth-child(1)').filter(function() { 
 
    return $(this).text().indexOf(val) != -1; 
 
    // get text content using text() and compare 
 
    // and use indexOf() for checking string contains the value. 
 
}).closest('tr').show();

#custom-table tr { 
 
    display: none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<table id="custom-table"> 
 
    <tr> 
 
    <td>abc</td> 
 
    <td>absc</td> 
 
    </tr> 
 
    <tr> 
 
    <td>abcd</td> 
 
    <td>abcd</td> 
 
    </tr> 
 
    <tr> 
 
    <td>abc</td> 
 
    <td>absc</td> 
 
    </tr> 
 
    <tr> 
 
    <td>abcd</td> 
 
    <td>abcd</td> 
 
    </tr> 
 
</table>

Answer 2

$('#custom-table tr > td:nth-child(1)').find("*").filter(function() { 
    return $(this).text() === val; 
}).closest('tr').show();