选择表行中离按钮最近的元素

Question

我有这个表:

<table>
<tr>
<td id="name">Name</td>
<td>Surname</td>
<td>Date</td>
<td>City</td>
<td>ZIP</td>
<td><a href="#" onclick="GetElement(this)">Get Element</a></td>
</tr>
<tr>
<td id="name">Name2</td>
<td>Surname2</td>
<td>Date2</td>
<td>City2</td>
<td>ZIP2</td>
<td><a href="#" onclick="GetElement(this)">Get Element</a></td>
</tr>
</table>

通过单击锚链接，我想获得第一、第三和第四个<td>。我试图用jQuery使用closest()，但我得到未定义。如有任何帮助，不胜感激。

function GetElement(e){
var elem = $(e).closest("#name").text();
console.log(elem);
}

Answer 1

closest不工作。但你并没有瞄准正确的元素。获取tr代替(#name不是a元素的父元素，因此是undefined)。然后您可以使用find():

获取孩子

function GetElement(link) {
$(link).closest('tr').find('td:nth-child(1), td:nth-child(3), td:nth-child(4)').addClass('red');
}

a {
color: blue;
}
.red {
color: red;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
<tr>
<td>Name</td>
<td>Surname</td>
<td>Date</td>
<td>City</td>
<td>ZIP</td>
<td><a onclick="GetElement(this)">Get Element</a></td>
</tr>
<tr>
<td>Name2</td>
<td>Surname2</td>
<td>Date2</td>
<td>City2</td>
<td>ZIP2</td>
<td><a onclick="GetElement(this)">Get Element</a></td>
</tr>
</table>