javascript - 在普通js中获取最后一个类名

Question

我似乎无法在这里或其他不基于 jQuery 的网站上找到与此主题相关的帖子。我需要一个简单的 JavaScript 解决方案来完成我需要做的事情。

好的，所以我需要获取最后一个类名元素，而不使用类似的东西

document.querySelectorAll('.name')[7].innerHTML;

我需要一种不需要我通过方括号之间的计数来计数和选择最后一个类名的方法，如上面的示例。原因就在于我

页面上有 100 个带有类名调用名称的元素，我不想在这种情况下使用上面的示例结构。

我的代码陷入困境

//????? I will like the last class name to be outputted in a alert but how?
/*alert(last_class_name);*/

  <h1 class='name'>Adam</h1>
  <h1 class='name'>Bob</h1>
  <h1 class='name'>Cindy</h1>
  <h1 class='name'>Danny</h1>
  <h1 class='name'>Eddy</h1>
  <h1 class='name'>Frank</h1>
  <h1 class='name'>George</h1>
  <h1 class='name'>Henry</h1>

注意:

问题已解决，请查看我的答案和 Alexander Nied 的答案，以更好地理解答案。

Answer 1

您可以在一个查询中获取名称，然后只需按总长度减 1 的索引进行获取，如下所示:

let names = document.querySelectorAll('.name');
let last = names[names.length-1];
console.log(last);

  <h1 class='name'>Adam</h1>
  <h1 class='name'>Bob</h1>
  <h1 class='name'>Cindy</h1>
  <h1 class='name'>Danny</h1>
  <h1 class='name'>Eddy</h1>
  <h1 class='name'>Frank</h1>
  <h1 class='name'>George</h1>
  <h1 class='name'>Henry</h1>