Javascript 获取网格标头中的最后一个导航元素

我有一个网格，当导航中的最后一个元素有焦点时，我需要执行一个功能。但是，我无法让脚本找到行中的最后一个元素：

const cells = document.getElementsByClassName('ag-header-row');
[...cells].map(cell => {
  console.log(cells.length-1);
})

标题父标记：

<div class="ag-header-row" role="presentation" style="top: 0px; height: 32px; width: 800px;">

---

更新的Plnkr链接：

如果只需要在特定选择器中查找最后一个元素，请尝试以下操作：

var cells =document.querySelectorAll('.ag-header-row');
var last_cell = cells[cells.length-1];

---

返回所有

ag头单元格的列表，而不是最后一个元素。“cells”返回数组，但“last_cell”返回数组中的最后一个元素。至少应该是这样。它做了一次，但仍然出现未定义的
。如果运行console.log（cells.length）并返回0，则选择器错误。我试图找到您的选择器，但在本例中，它运行在一个iframe中。您拥有所有这些
元素。addEventListener
内容。你不使用ag grid的“键盘导航”功能有什么原因吗@thirtydot-它似乎不允许标题单元格之间的箭头键导航，也不允许使用箭头键从标题单元格访问身体单元格。我已经浏览了你的最后一组问题。这样做有什么意义？是因为无障碍的原因吗？另外，您是否考虑过用户更改列顺序或隐藏列的影响？您可能无法将所有这些代码都放入
onGridReady
。如果查看并搜索“AG-1543”，您将看到“允许tab键在列标题中的元素间导航”。这被标记为“复杂功能请求”。您基本上是在尝试破解一个难以实现的特性。要把它做好真的很难。您可能希望将此文件归入“太难了，让我们等待ag grid最终完成”类别。如果您有ag grid enterprise，您可以尝试向网格作者询问此功能请求。是的，这是为了方便访问。AG Grid目前也有很多积压的任务要做同样的事情，但我需要尽快添加这个功能。是的，我已经考虑了用户修改标题的影响（我需要以某种方式在componentDidUpdate中更新），但是在不更新标题的情况下进行测试。
const headerCells = document.getElementsByClassName('ag-header-cell');
const last_cell = headerCells[headerCells.length-1].attributes[2].value;
const hasFocusVisible = document.querySelector('.ag-header-cell-label').classList.contains('focus-visible');
console.log(hasFocusVisible);
[...headerCells].map(headerCell => {
  console.log(headerCell)
  headerCells.addEventListener("keydown", function(e) {
    if(e.key === "ArrowRight" && hasFocusVisible == true && last_cell) {
      //if last_cell and 'ag-header-cell-label' has 'focus-visible', set focus to first cell in body
      const bodyCell = document.getElementsByClassName('ag-cell')[0];
    }
  })
});

var cells =document.querySelectorAll('.ag-header-row');
var last_cell = cells[cells.length-1];