1

我对 JavaScript 和 DOM 比较陌生，但对 C++ 有经验。我正在进行几个严重依赖 DOM 的 JavaScript 实验，包括一个响应命令的控制台。整个工作正常，除非元素比页面长。控制台的工作方式是使用 DOM，它接受一个元素并向内容添加一行。这是一个问题，因为在清除它时，我无法针对特定行（即顶部行）来仅清除/修改该行。我已经尝试了我所知道的一切，循环、数组、嵌套 if 等，但没有运气。我只是希望控制台停止无休止地扩展，要么有一个滚动条，要么只是开始清除旧行。这是当前的清算机制（非常没用）：

if (extended > 24)
{
    alert("Message Stream full, resetting.");
    document.getElementById("boxRightSpace").innerHTML = "";
    extended = 0;
}

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

4

1 回答 1

0

每次插入新行时，您都可以将控制台滚动到底部：

document.getElementById("boxRightSpace").scrollTop = document.getElementById("boxRightSpace").scrollHeight;

控制台 div 本身必须有一个固定的高度，overflow:auto就像这样

#boxRightSpace {
   overflow: auto;
   height: 300px;
   width: 400px;
}

或者，您可以通过这种方法删除行：

<div id="boxRightSpace">
    <div>line1</div>
    <div>line2</div>
    <div>line3</div>
    <div>line4</div>
    <div>line5</div>
    <div>line6</div>
    <div>line7</div>
    <div>line8</div>
</div>

<script>

    var max_console_items = 5,
        cons= document.getElementById("boxRightSpace"),
        console_items = cons.getElementsByTagName("div");

    while (console_items.length > max_console_items)
    {
        cons.removeChild(console_items[0]);
    }
</script>
于 2012-11-18T18:03:48.277 回答