removeChild 不是函数答案

【问题标题】：removeChild is not a functionremoveChild 不是函数
【发布时间】：2016-12-05 07:13:42
【问题描述】：

window.onload = initPage;
var firstname = false;
var lastname = false;

function initPage() {
    addEventHandler(document.getElementById("firstname"), "blur", verifyFirst);
    addEventHandler(document.getElementById("lastname"), "blur", verifyLast);
    addEventHandler(document.getElementById("submit"), "click", showName);
}

function verifyFirst(e) {
    var me = getActivatedObject(e);
    if (me.value === "") {
        me.className = "error";
        me.focus();
        me.select();
        return;
    }
    else {
        me.className = "";
        firstname = true;
        enabledButton();
    }
}

function verifyLast(e) {
    var me = getActivatedObject(e);
    if (me.value === "") {
        me.className = "error";
        me.focus();
        me.select();
        return;
    }
    else {
        me.className = "";
        lastname = true;
        enabledButton();
    }
}

function enabledButton() {
    if (firstname && lastname) {
        document.getElementById("submit").disabled = false;
    }
    else {
        document.getElementById("submit").disabled = true;
    }
}

function showName() {
    var first = document.getElementById("firstname").value;
    var last = document.getElementById("lastname").value;
    var word = first.toLowerCase() + last.toLowerCase();
    for (var i = 0; i < word.length; i++) {
        var letter = word.charAt(i);
        var img = document.createElement("img");
        img.setAttribute("src", "images/" + letter + ".png");
        img.setAttribute("style", "left:" + 50 * i);
        document.getElementById("displayname").appendChild(img);
    }
    var t = setInterval(removeName, 2000);
}

function removeName() {
    var display = document.getElementById("displayname").getElementsByTagName("img");
    var lengthOfDisplay = display.length;
    for (var i = 0; i < lengthOfDisplay; i++) {
        document.getElementById("displayname").removeChild(display[i]);
    }
    var t = setInterval(showName, 2000);
}

这是我正在处理的当前代码。我正在创建一个包含名字和姓氏两个输入字段的网站。在验证每个字段后，他们将启用提交按钮。单击提交按钮时，它将结合名字和姓氏，然后将每个字母分开并调用与输入的每个字母相关的图像并将其显示在 displayname div 上。

这是我遇到问题的地方：

我想要的是显示图像然后删除图像并使用 setInterval 再次连续显示。（即与图像拼写的名称将闪烁）。不幸的是，当我尝试使用 removeChild 函数删除图像时，我的代码出现以下错误：

更新

未捕获的类型错误：无法在“节点”上执行“removeChild”：参数 1 不是“节点”类型。

下面是检测工具的图像，其中包含错误和出现错误的行。

当我要求它使用 removeChild(display[i]) 删除图像时，为什么会出现此错误？

【问题讨论】：

片段getElementById("displayname".removeChild中缺少)

标签： javascript html removechild

【解决方案1】：

将第 68 行替换为

document.getElementById("displayname").innerHTML = '';

【讨论】：

看起来这修复了我的代码。如此简单的修正，但我无法弄清楚。我想我太喜欢节点了，以至于忘记了这个简单的代码。谢谢你。现在我只需要修复我的代码的 setInterval 部分以使其超时，以便它可以很好地超时并且不会时不时地显示两次名称。
这将从#displayname 中删除所有内容，而OP 的代码仅删除img 节点。如果 OP 确实想删除所有内容，则也不需要第 67 行的 for 循环。

【解决方案2】：

从这里更改第 68 行的代码

document.getElementById("displayname".removeChild(display[i]));

到这里

document.getElementById("displayname").removeChild(display[i]);

【讨论】：

更新了新的错误。对不起。我在写这篇文章时试图修复我的代码，我想我犯了一个小的语法错误。这是我遇到的实际错误。

【解决方案3】：

removeChild() 是一种适用于节点的方法（而不是您在代码中使用的字符串或选择器）。

document.getElementById("displayname").removeChild(display[i])); 应该是适当的语法。

【讨论】：

在出现小语法错误后更新了新错误。对于那个很抱歉。这是我正在调查的实际错误。在修复它时，我想我犯了一个错误并出现语法错误。