js擷取html表單裡面的某一進制素的值

對于新手，在擷取元素的資訊時，常常會遇到如何準确選擇到想要擷取的元素問題

例如：想要擷取目前按鈕所在行的某一進制素值：

當點選鉛筆圖示擷取到目前行id的值0

具體實作：

html代碼：

<tbody id="tabletest">

	<tr>
		<td class="td id">0</td>
		<td>admin</td>
		<td>admin</td>
		<td>張老師</td>
		<td>http://atth.jzb.com/forum/201601/15/100844l55jr2d5b8wnc5ee.jpg</td>
		<td>1</td>
		<td>1</td>
		<td>2017-4-13</td>
		<td>
			<div class="btn-group btn-group-xs">
				<button class="btn btn-transparent eye">
					<i class="fa fa-eye"></i>
				</button>
				<button class="btn btn-transparent update">
					<i class="fa fa-pencil"></i>
				</button>
				<button class="btn btn-transparent delete">
					<i class="fa fa-times"></i>
				</button>
			</div>
		</td>
	</tr>
	<tr>
		<td class="td id">1</td>
		<td>student</td>
		<td>student</td>
		<td>李同學</td>
		<td>http://atth.jzb.com/forum/201601/15/100844l55jr2d5b8wnc5ee.jpg</td>
		<td>0</td>
		<td>1</td>
		<td>2017-4-17</td>
		<td>
			<div class="btn-group btn-group-xs">
				<button class="btn btn-transparent eye">
					<i class="fa fa-eye"></i>
				</button>
				<button class="btn btn-transparent update">
					<i class="fa fa-pencil"></i>
				</button>
				<button class="btn btn-transparent delete">
					<i class="fa fa-times"></i>
				</button>
			</div>
		</td>
	</tr>
</tbody>
           

js實作代碼：

var i=$(this).parents("tr").find(".td.id").text(); 
alert(i);
           

實作原理：

1.通過$(this)擷取所點選的按鈕

2.$(this).parents("tr")擷取按鈕所在行

3.$(this).parents("tr").find(".td.id").text()擷取按鈕所在行class為td id的元素的值