javascript - 使用 JS 移除元素但填充剩余空间

Question

作为一种教育经历，我一直在不同的网站上使用 JavaScript。

我想尝试使用 JavaScript 删除整个右栏，但也让其余的正文填充从删除栏收到的空间。

但是，我只成功删除了右侧栏，但页面的其余部分并没有填充新的缺失空间。我可以只使用 JavaScript 控制台来做到这一点吗？

JS代码：

child = document.getElementById("content-related");
child.parentNode.removeChild(child);

score 1 · Accepted Answer

检查CSS。#content-main 的属性宽度为 70%。

为了填满整个空间：

document.getElementById("content-main").style.width = '100%';

score 1 · Accepted Answer

content-maindiv 设置为总宽度的 70% 。

添加此行

document.getElementById('content-main').setAttribute('width', '100%');

或者这个

document.getElementById('content-main').style = 'width:auto';

score 1 · Accepted Answer

如果您还没有，请熟悉浏览器的开发工具（通常您可以使用F12密钥启动它们）。这将允许您在控制台中尝试命令以及查看页面上的元素。

如果您查看层次结构，则会有一个 id 的 divcolumnwrap包含content-main和content-related。您的命令正常工作并删除了元素，但如果您content-main在开发工具中查看该元素，您会看到它被设置为70%宽度，因此它不会重排并占用其余空间。

您可以通过将content-main元素的宽度设置为100%或来重置元素的宽度auto。

document.getElementById('content-main').style = 'width: 100%';
document.getElementById('content-main').style = 'width: auto';

3 回答 3