无需JavaScript能否选择HTML标签？HTML5实现按钮显隐元素可行吗？

可以实现，HTML5原生提供了<details>和<summary>元素，无需JavaScript就能完成折叠/展开（显示/隐藏）功能。

方法一：使用<details>和<summary>（纯HTML5） #

这是最简洁的原生方案，完全依赖HTML5特性：

<details>
  <summary>点击我显示/隐藏内容</summary>
  <p>这是被隐藏的内容，点击上方区域即可切换显示状态。</p>
  <div>任何HTML元素都可以放在这里，比如图片、列表、表格等</div>
</details>

• <summary>会被浏览器渲染为可点击的触发区域，点击它就能切换<details>内部其他内容的显示/隐藏状态。
• 默认状态下内容是收起的，若要默认展开，给<details>添加open属性即可：<details open>。

方法二：复选框配合CSS（无JS，需少量样式） #

如果需要自定义触发按钮的外观，而非<summary>的默认样式，可以用HTML复选框结合CSS兄弟选择器实现，同样不需要JavaScript：

<style>
  /* 隐藏原生复选框 */
  #toggle-check { display: none; }
  /* 自定义按钮样式 */
  .toggle-btn { cursor: pointer; padding: 6px 12px; border: 1px solid #ddd; border-radius: 4px; background: #f5f5f5; }
  /* 默认隐藏目标元素 */
  .hidden-content { display: none; margin-top: 10px; }
  /* 复选框选中时显示目标元素 */
  #toggle-check:checked ~ .hidden-content { display: block; }
</style>

<label for="toggle-check" class="toggle-btn">点击切换显示/隐藏</label>
<input type="checkbox" id="toggle-check">
<div class="hidden-content">
  这是要控制显示/隐藏的内容，支持任意HTML结构。
</div>

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