如何在某个<tr>中选择某个<td>的值/innerHTML？仅使用 JavaScript。没有 jQuery

Question

<table>
  <tr>
    <td>foo1</td>
    <td>bar1</td>
    <td><input type="button" id="button1" onClick="get(this);"></td>
  </tr>
  <tr>
    <td>foo2</td>
    <td>bar2</td>
    <td><input type="button" id="button2" onClick="get(this);"></td>
  </tr>
</table>

目标：获取按钮button1并button2触发相同的按钮，该按钮应该获取按钮所在位置的第一个按钮function get()的值。在本例中，分别是：和。<td><tr>foo1foo2

这是该功能的粗略轮廓，应该有助于理解我想要实现的目标-

function get(element){
  alert(element.tr.first_td.innerHTML);
}

我意识到有一个 jQuery 解决方案可以解决类似的问题。但我对 jQuery 的理解还不够深入，无法将其翻译回 JavaScript。如果可以使用 JavaScript，请告诉我如何操作。

Answer 1

爬行parentNode两次即可到达tableRow元素。从那里，访问单元格的 HTMLCollection 中的第一个td，并获取innerHTML，并获取值：

\n\n

function find( element ) {\n    alert( element.parentNode.parentNode.cells[0].innerHTML );\n}\xe2\x80\x8b\n

\n\n

小提琴： http: //jsfiddle.net/jonathansampson/WuWnw/

\n