Javascript 按类名获取祖先

我有一个组件，它有按钮和列表，这两个按钮都在单击时执行事件。我需要一种获取这些元素的祖先元素的通用方法。结构看起来像

<div class='a'>
   <button class ='b' data-name="hello">
      <span class ='c'>clickMe
         <span>somehting</span>
      </span>
   <button>
   <ul class ='d'>
      <li data-name="about">
          <span class ='e'>something here
             <span>somehting</span>
          </span>
      </li>
      <li data-name="home">
          <span class ='e'>something elser here
              <span>somehting</span>
          </span>
      </li>
   </ul>
</div>

不确定如何获得正确的元素，无论它是按钮还是li。我是否需要向所有元素添加唯一的类

使用jquery.parentsli函数。它将选择与css过滤器匹配的所有父级。所以你可以

var parentli=targete1.parentsli

或者类似的东西

编辑： 不知道为什么我被否决了，这是我的想法

可能按f12检查元件并查看控制台日志

var onClick=函数{ var parentEl=$this.parentsbutton，li[0]； console.logparentEl； $result[0]。innerText=parentEl.getAttributedata-name； }; $'span.c'。单击鼠标右键； $'li span.e'。单击鼠标右键； 点击我 某物 这里有东西 一些 还有别的吗 某物 结果显示在这里只需使用e.currentTarget

var result=document.querySelector'result'； var clickables=document.queryselectoral'按钮，li'； //向元素添加单击侦听器 对于变量i=0，l=clickables.length；i单击元素的数据名称显示在此处如果单击的元素始终是包含名称数据的元素的直接后代，您不能只使用e.target.parentNode吗？实际上，span元素不能有附加的span子元素。更具体地说，我编辑了这个问题。然而，我能想到的唯一解决方案是给每个元素指定一些类名称，尽管有些人会认为这是一件好事，因为性能问题，没有办法使用css选择器来获取父元素。让我确定我理解你。因此，您单击span.e元素中的任何一个，您需要获取父li元素，它并不总是直接父元素，还需要从按钮获取数据名信息。b？啊，假设您单击其中一个li元素中的span元素，那么您应该获取该li元素的数据名。类似地，如果您单击按钮中的span元素，您应该会得到按钮的数据名。您可能会得到下一票，因为OP没有标记为JQuery。而且，.nestest通常比.parents更好

var targetel = goog.dom.getAncestorByClass(e.target,null,class??);

var button = targete1.parents("div").children[0];