tdをクリックしてテーブルIDを取得してください：Pure JavaScript

Question

それぞれが（明らかに）一意のIDを持つ一連のHTMLテーブルを生成するプログラムを作成しています。各表のセルの中には、onClickハンドラがあります（また、それぞれには固有のIDがあります）。私はonClickを呼び出す関数のパラメータとしてそれを使用するために、セルをクリックしてテーブルIDを取得できるようにしたい。

この質問は、特にJQuery用に以前に（そしてanswered）質問されましたが、純粋なJavaScriptで行うことをお勧めします。私はそれが可能でなければならないと思いますが、どうですか？

Answer 1

次のことを試してください：

私は、これはすぐにダウン票2を集めている参照

var tds = document.getElementsByTagName("td"); 
 

 
var getParentTableID = function() { 
 
    var el = this; 
 
    while ((el = el.parentElement) && el.nodeName.toUpperCase() !== 'TABLE'); 
 
    console.log(el.id);//Table id 
 
}; 
 

 
for(var i = 0; i < tds.length; i++) { 
 
    tds[i].onclick = getParentTableID; 
 
};

<h4>Table1</h4> 
 
<table id="tableID_1"> 
 
    <tr> 
 
    <td>1</td> 
 
    <td>2</td> 
 
    <td>3</td> 
 
    </tr> 
 
    <tr> 
 
    <td>4</td> 
 
    <td>5</td> 
 
    <td id="b3">6</td> 
 
    </tr> 
 
    <tr> 
 
    <td>7</td> 
 
    <td>8</td> 
 
    <td>9</td> 
 
    </tr> 
 
</table> 
 
<h4>Table2</h4> 
 
<table id="tableID_2"> 
 
    <tr> 
 
    <td>1</td> 
 
    <td>2</td> 
 
    <td>3</td> 
 
    </tr> 
 
    <tr> 
 
    <td>4</td> 
 
    <td>5</td> 
 
    <td id="b3">6</td> 
 
    </tr> 
 
    <tr> 
 
    <td>7</td> 
 
    <td>8</td> 
 
    <td>9</td> 
 
    </tr> 
 
</table>

Answer 2

はそれを試してみてください。

<table id="Test"> 
    <tr> 
    <td onclick="test(this)">teste</td> 
    <td>teste</td> 
    </tr> 
</table> 

<table id="Test2"> 
    <tr> 
    <td onclick="test(this)">teste</td> 
    <td>teste</td> 
    </tr> 
</table> 

<script> 
function test(obj) { 

    while(obj.tagName.toUpperCase() !== "TABLE") { 
    obj = obj.parentNode; 
    } 

    console.log(obj.id); 

} 

</script>