HTML与JavaScript中，如何获取当前按钮所在的无标识<div>元素？

嘿，这个问题其实挺常见的，不用给div加ID或类也能轻松搞定，给你几个实用的方法：

1. 利用parentNode直接获取父元素 #

因为按钮是div的直接子元素，我们可以在点击事件里把按钮本身传进去，然后通过它的parentNode属性拿到父级div。这种方法简单直接，适合按钮就是div直接子元素的场景：

<div>
  <button onclick="action(this)">button</button>
</div>

<script>
function action(btnElement) {
  // 获取按钮所在的div
  const targetDiv = btnElement.parentNode;
  
  // 举个操作例子：修改div背景色
  targetDiv.style.backgroundColor = '#f0f8ff';
  // 或者添加内容
  targetDiv.innerHTML += '<p>我是被操作后的div内容</p>';
}
</script>

2. 用closest()方法灵活查找祖先元素 #

如果按钮不是div的直接子元素（比如中间嵌套了span、label等标签），closest()会更实用，它会从当前元素开始向上查找，返回第一个匹配指定选择器的祖先元素：

<div>
  <span class="wrapper">
    <button onclick="action(this)">button</button>
  </span>
</div>

<script>
function action(btnElement) {
  // 找到最近的div祖先元素
  const targetDiv = btnElement.closest('div');
  
  // 操作示例：给div加边框
  targetDiv.style.border = '2px solid #2ecc71';
}
</script>

3. 通过事件对象event获取父元素 #

如果你不想在onclick里传this，也可以传事件对象，通过event.currentTarget拿到触发事件的按钮，再获取父级div：

<div>
  <button onclick="action(event)">button</button>
</div>

<script>
function action(event) {
  const btnElement = event.currentTarget;
  const targetDiv = btnElement.parentNode;
  
  // 操作示例：修改div文本
  targetDiv.textContent = '按钮所在的div已被操作';
}
</script>

这几种方法都不需要给div加任何标识，完全靠DOM元素的层级关系来定位，根据你的实际DOM结构选合适的就行～

内容的提问来源于stack exchange，提问作者user9724045