0

Noob質問アラート！私は毎秒更新する基本的な時計に取り組んでいますが、キャッチされないエラーが発生するため更新されません：NOT_FOUND_ERR：DOM例外8。基本的に、関数の最後にあるremoveChild（）を別のものに変更する必要がありますが、何に変更すればいいのかわからない。作成中のを削除したい<p class="time">。

function spitTime() {
    var clock = new Date();
    var hours = clock.getHours();
    var minutes = clock.getMinutes();
    var seconds = clock.getSeconds();

    if (minutes <= 9) {
        minutes = "0" + minutes;
    }

    if (seconds <= 9) {
        seconds = "0" + seconds;
    }

    var displayTime = hours + ":" + minutes + ":" + seconds;
    var newTimeElem = document.createElement("p");
    newTimeElem.className = "time";
    var timeText = document.createTextNode(displayTime);
    newTimeElem.appendChild(timeText);
    document.getElementById("timePlace").appendChild(newTimeElem);
    document.getElementById("timePlace").removeChild();
}

関連するHTML：

<div class="clock">
    <span id="timePlace"></span>
</div>
4

5 に答える 5

2

あなたの質問によると、子を削除したくない、既存の要素のテキストを変更したい。

これには、次を使用できますtextContent。

document.getElementById( 'timePlace' ).textContent = displayTime;

これはクロスブラウザではないことに注意してください。代わりにIE8 以下で動作しinnerTextます。使用する簡単なハックは次のとおりです。

var timePlace = document.getElementById( 'timePlace' );
if ( 'textContent' in timePlace ) {
    timePlace.textContent = displayTime;
}
else {
    timePlace.innerText = displayTime;
}

ただし、これはハックです。あなたのケースではうまくいきますが、これに頼らないでください。

ブラウザ間の互換性が本当に必要な場合は、ところで jQuery (またはこのような他のライブラリ) を使用しています。テキストを変更するjQueryの方法：

$( '#timePlace' ).text( displayTime );

これはnodeValue、テキストを処理するための唯一の真のクロスブラウザー方法です。ただし、これは でのみ使用できるため、これを再帰的に行う必要がありますtextNodes。data（@amnotiamが質問のコメントで行うように）を使用することと同等です。

于 2012-07-17T17:51:25.997 に答える
1

削除する子ノードを指定していません。

Node.removeChild

var oldChild = element.removeChild(child);
element.removeChild(child);
  • childは、DOMから削除される子ノードです。
  • elementは子の親ノードです。
  • oldChildは、削除された子ノードへの参照を保持します。oldChild==子
于 2012-07-17T17:49:38.383 に答える
0

timePlace要素自体を削除する場合：

document
    .getElementById("timePlace")
    .parentNode
    .removeChild(document.getElementById('timePlace'));

これが意図であると仮定すると、これは、関連する要素/ノード（getElementById()）を見つけ、その要素のに移動してparentNodeから、親から要素を削除することによって機能します（removeChild()どちらも、DOMノードが渡されることを期待し、子を削除するため）現在の要素/ノードのノード）。

OP（下記）からのコメントに従って更新されました。単に使用してください。

newTimeElem.parentNode.removeChild(newTimeElem);

参照：

于 2012-07-17T17:48:34.633 に答える
0 
    <script type="text/javascript"> 
        function spitTime() {
            var clock = new Date();
            var hours = clock.getHours();
            var minutes = clock.getMinutes();
            var seconds = clock.getSeconds();

            if (minutes <= 9) {
                minutes = "0" + minutes;
            }

            if (seconds <= 9) {
                seconds = "0" + seconds;
            }

            var displayTime = hours + ":" + minutes + ":" + seconds;
            var newTimeElem = document.createElement("p");
            newTimeElem.className = "time";
            var timeText = document.createTextNode(displayTime);
            newTimeElem.appendChild(timeText);
            $('#timePlace').children('.time').remove();
            document.getElementById("timePlace").appendChild(newTimeElem);
            setTimeout('spitTime()', 100);
        }
        $(document).ready(function(){
            setTimeout('spitTime()', 100);
        });
    </script>
</head>
<body>
    <div class="clock">
        <span id="timePlace"></span>
    </div>
</body>

リンク: http://lib-eguide.nus.edu.sg/test1.php

于 2012-07-17T17:51:25.987 に答える
0 
while (timePlace.firstChild) {
    timePlace.removeChild(timePlace.firstChild)
}

コンテンツを編集するだけの方が良いかもしれませんが、これは私にとって非常にうまく機能します。

于 2012-07-17T19:10:53.543 に答える