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;

console-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 に答える