使用greasemonkey移除和折叠元素

Question

我想从网页中删除上面和左边的元素(使用greasemonkey/scriptish)，以优化其布局，以便在galaxy标签10.1上显示它。

网页是tvtv.de的，我的第一个方法(我对修补网页完全是新手)是：

// ==UserScript==
// @include     http://www.tvtv.de/*
// ==/UserScript==

var elmDeleted = document.getElementById("header");
elmDeleted.parentNode.removeChild(elmDeleted);
elmDeleted = document.getElementById("main_left");
elmDeleted.parentNode.removeChild(elmDeleted);

有问题的元素被清除，但仍然使用布局中的原始空间。我还尝试了不同的方法，比如将元素宽度设置为零，隐藏元素(element.style.display="none")等，但结果总是相同的。

有没有可能“折叠”元素，这样它们就不会在页面布局中使用任何空间？

任何帮助都将不胜感激，提前感谢。

Answer 1

您正在正确地删除/隐藏元素。如果它们是相对定位的，那么它们将折叠以填充可用的空间。

在这个特殊的网站中，主要内容是绝对定位的。要折叠元素，请使用：

var css = '#main_left, #main_right { top: 0; }',
    style = document.createElement('style');
    style.appendChild(document.createTextNode(css));
document.body.appendChild(style);

Answer 2

实际上它不会占用任何空间，因为它已经不在那里了。

页面的其余部分不向上移动的原因是因为元素显式地定位在距顶部100个像素的位置。例如，请参阅styles.css中#main_right的样式

#main_right
{
    background-color: #FFFFFF;
    /* -------------------- */
    position: absolute;
    left: 180px;
    right: 0px;
    top: 100px;
    /* -------------------- */
    bottom: 21px;
    overflow: visible;
}

您必须手动调整这些对象的位置。