如何将一个div删除后移动到另一个div的空间中？

Question

看来旧的 Slack 桌面 UI 终于坏了，太糟糕了。

所以我打开

/slackdevtools

并将控制条移到左侧，然后删除了讨厌的、完全不必要的标签导轨，但仍然留有一个空白空间：

strip = document.querySelector('div.p-control_strip');
document.querySelector('div.p-workspace_switcher_prototype').appendChild(strip);
strip.style.left='0px'
document.querySelector('div.p-tab_rail').remove()

之前：

之后：

理想的：#general 就在 + 号旁边，也就是原来的“稍后”。换句话说，我如何强制

div.p-client_workspace__layout

占据

div.p-tab_rail

曾经占据的空间？这甚至不是 Slack 桌面问题，而是 JS/CSS 问题。显然我需要在删除之前保存一些东西，但是什么呢？ （我什么都不知道。我是后端开发人员。）

Answer 1

document.querySelector('.p-client_workspace_wrapper').style.gridTemplateColumns = '0 auto';

如果您来这里是为了让 slack ui 恢复到原来的状态，请尝试

const domObserver = new MutationObserver(() => {
    let rail = document.querySelector('div.p-tab_rail');
    if (rail) {
        rail.remove();
        let old_strip = document.querySelector('div.p-workspace_switcher_prototype div.p-control_strip')
        if (old_strip) {
            old_strip.remove()
        }
        let strip = document.querySelector('div.p-control_strip');
        document.querySelector('div.p-workspace_switcher_prototype').appendChild(strip);
        strip.style.left=0;
        document.querySelector('.p-client_workspace_wrapper').style.gridTemplateColumns = '0 auto';
    }
});
domObserver.observe(document.body, {
    subtree: true,
    childList: true,
});