web-dev-qa-db-ja.com

JavaScriptを使用してHTMLページをクリアする

JavaScript関数を使用してページ上の既存のコンテンツの一部を削除する方法はありますか?
このような:

<I WANT THIS CLEARED>
<IS THERE ANY JAVASCRIPT OR HTML STATEMENT I CAN PUT HERE?>
<I WANT THIS DISPLAYED>

<IS THERE ANY JAVASCRIPT OR HTML STATEMENT I CAN PUT HERE?>には何を入れるべきですか?

表示したい部分の後に<div style="display:none"><plaintext>を付けるとページの終わりが非表示になることは知っていますが、最初をクリアするにはどうすればよいですか?

8
Adrian Chang

document.body.innerHTML = ""を使用できます。ブラウザがページを処理する限り、本文内のすべてのものを取り出します。次の例を参照してください。

<html>
    <head></head>
    <body>
        <p>This should not appear</p>

        <script type="text/javascript">
            document.body.innerHTML = '';
        </script>

        <p>This should appear.</p>
    </body>
</html>

ただし、これはこれを達成するための優れた方法ではありません。一部のテキストを非表示にする場合は、他の人が言及しているようにjQueryを検討してください。

18
EndangeredMassa

Javascriptで属性と要素を操作できます。したがって、以下ではテキストthe second partのみが表示されることがわかります。

<div id="top" style="display:none;">
the first part
</div>
<div id="bottom">
the second part
</div>

これらのセクションを動的に操作するには、次のようなjavascript関数を呼び出すことができます。

function toggle()
{
    var top = document.getElementById("top");
    var bottom = document.getElementById("bottom");

    if (top.style.display == "none")
    {
        top.style.display = "block";
        bottom.style.display = "none";
    }
    else
    {
        top.style.display = "none";
        bottom.style.display = "block";
    }
}

そしてもちろん、これを変更してさらに多くのことを行うことができます。

3
Joel