在现有元素旁边放置一个新元素

Question

我正在做一个网站。我想要一个表格，当我点击一个单元格时，一个“窗口”将出现在单元格的正下方。正如我现在所做的那样，我将单元格的 ID 作为参数传递给 myFunction()。然后搜索哪个，以便我可以使用该元素并找到它的位置。我觉得这是一种非常糟糕的做法。我得到了我想要的结果，但必须将 ID 作为硬编码参数传递似乎很脆弱。<td id="player 1" onclick="myFunction('player 1')">function myFunction(id_name) {    var element = document.getElementById(id_name);    var tmp = element.getBoundingClientRect();    x_pos = tmp['x'];    y_pos = tmp['y'];    height = tmp['height']    var dr = document.getElementById("myDropdown");    dr.style.position = "absolute";    dr.style.left = x_pos+'px'    dr.style.top = y_pos+height+'px'    dr.classList.toggle("show");}

Answer 1

您可以将事件传递给您的函数，而不是硬编码的字符串 ID。

onclick="myFunction(event)"

更改函数的定义以接受事件

function myFunction(e)

事件对象将包含有关引发事件的元素（目标）的信息。

Event.target对事件最初调度到的目标的引用。