时间戳

首页 > 解决方案 > 无法隐藏 z-index 设置为 1 的同级元素

javascript - 无法隐藏 z-index 设置为 1 的同级元素

问题描述

我有一个覆盖另一个元素的模式。下部元素上的关闭按钮的 z-index 设置为 1。当我创建模式时，这个原始关闭按钮仍然嵌套在新模式及其新关闭按钮的顶部。

我尝试在 dom 中抓取这个元素并将其隐藏，但由于它不是父元素，我不知道如何。

编辑：这是伪代码......问题是如何删除覆盖的兄弟元素。

<div>
  <div>
    <img style={{z-index: 1; position: fixed;}}>close button (sibling, this one needs to be moved underneath or hidden)</img>
  </div>
<div>
<div>
  <div>
    <img style={{z-index: 1; position: relative;}}>close button (popup modal)</img>
  </div>
</div>

已解决：事实证明，无论它在 DOM 层次结构中的哪个位置（添加 id 之后），我都可以通过它的 id 抓取元素并切换它的显示。不知道为什么我不这么认为。¯_(ツ)_/¯

const closeBtn = document.getElementById('closeBtnSibling');
closeLessonBtn.style.display = 'none';

和

closeLessonBtn.style.display = null;

标签： javascripthtmlcssreactjs

解决方案

style={z-index: 1; position: fixed;}->style={{zIndex: 1, position: 'fixed'}}

React 内联样式参考：https ://reactjs.org/docs/dom-elements.html#style

推荐阅读