如何在 JavaScript 中获取 span 标签父类名？答案

【问题标题】：How to get span tag parent class name in JavaScript?如何在 JavaScript 中获取 span 标签父类名？
【发布时间】：2019-02-01 12:50:38
【问题描述】：

<div class="todo"> <h3>Have to understand js DOM</h3>
        <div class="ed-btn">
          <span id="delete" onclick="deleteTodo(event)"><i class="far fa-trash-alt"></i></a>
          </span>`; </div>

const deleteTodo = event => {   console.log(event.currentTarget); };

通过点击 deleteTodo(event) 我刚刚发现

      <span id="delete" onclick="deleteTodo(event)"><i class="far fa-trash-alt"></i></a>

但是我怎样才能得到类 'todo' 或 h3 的内部内容呢？

【问题讨论】：

标签： javascript html dom tags jsdom

【解决方案1】：

点击文本'Some text'来触发监听器；）

非常简单：

parentElement 允许你获取父元素。

className 将为您获取节点的类。

innerText 会告诉你...内文；）

const deleteTodo = event => { 
  const target = event.currentTarget;
  const root = target.parentElement.parentElement;
  console.log('root class:', root.className);
  console.log('h3 content:', root.querySelector('h3').innerText); 
};

<div class="todo"> 
  <h3>Have to understand js DOM</h3>
  <div class="ed-btn">
    <span id="delete" onclick="deleteTodo(event)">
      <i class="far fa-trash-alt"></i>
      Some text
    </span>
  </div>
</div>

希望对你有帮助！

【讨论】：

【解决方案2】：

如果你想访问标签的父级，可以使用 parentElement 方法，如下所示：

document.getElementById("delete").parentElement