Question

这是一个文字每秒都在变化的网站。

function changer() {
    if (typeof index == 'undefined') {
        index = 1;
    }

    if (index == 1) {
        change = document.getElementById("text");
        //alert(change);
        words = document.createTextNode("This text is always changing.");
        change.appendChild(words);
        change.parentNode.replaceChild(words, change);
        index = index + 1;
    } else {
        change = document.getElementById("text");
        //alert(change);
        words = document.createTextNode("Yes it is. Yes it is.");
        change.appendChild(words);
        change.parentNode.replaceChild(words, change);
        index = index - 1;
    }

    setTimeout('changer()', 1000);
}

第一次通过循环（当index == 1时）document.getElementById（“text”）= [object HTMLDivElement]，但第二次它是null。

为什么有些东西会起作用，然后不能再次工作？但也许有人可以解释原因和/或解释如何解决它。

这是index.html：

<!DOCTYPE html>
<html>
<head>
<script src="changer.js"></script>
</head>
<body onload="changer();">
<div contenteditable="true" id="text"><div/>
</body>
</html>

Answer 1

您可以设置对象中的属性innerText，它将替换所述对象的内容，因此您可以像这样使用它：

var index = 1;
function changer() {
    if (index == 1) {
        text.innerText = "This text is always changing.";
        index = index + 1;
    } else {
        text.innerText = "Yes it is. Yes it is.";
        index = index - 1;
    }
    setTimeout(changer, 1000);
}

Answer 2

此行删除了其容器：

change.parentNode.replaceChild(words, change);

那是因为没有孩子;）

document.createTextNode("Yes it is. Yes it is.");

不会生孩子，只是纯文本。

所以div将被文本替换。这就是为什么它给你一个空的

Answer 3

谢谢你们。这是我的固定代码：

function changer() {

if (typeof index == 'undefined') {
index = 1;
}
if (typeof p == 'undefined') {
p = document.createElement("p");
}

if (index == 1) {

    words1 = document.createTextNode("This text is always changing.");
        if(typeof words2 !=='undefined'){
        p.replaceChild(words1, words2);
        }else{
        p.appendChild(words1);
        }
    index = index + 1;
}else{

    words2 = document.createTextNode("Yes it is. Yes it is.");
        if(typeof words1 !=='undefined'){
        p.replaceChild(words2, words1);
            }else{
            p.appendChild(words2);
            }
        index = index - 1;
}

    text = document.getElementById("text");
    text.appendChild(p);

setTimeout(changer, 1000);

}

为什么document.getElementById在这种情况下为null？

3 个答案: