removeChild 不是函数
removeChild is not a function
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);
}
这是我目前正在处理的代码。我正在创建一个网站,其中包含名字和姓氏的两个输入字段。在验证每个字段后,他们将启用提交按钮。单击提交按钮时,它将结合名字和姓氏,然后将每个字母分开并调用与输入的每个字母相关的图像并将其显示在显示名称 div 上。
这是我遇到问题的地方:
我想要的是显示图像然后删除图像并使用setInterval再次连续显示。 (即用图像拼写的名称将闪烁)。不幸的是,当我尝试使用 removeChild 函数删除图像时,我的代码出现以下错误:
更新
Uncaught TypeError: Failed to execute 'removeChild' on 'Node': parameter 1 is not of type 'Node'.
下面是检查工具的图像,其中包含错误和出现错误的行。
当我要求它使用 removeChild(display[i]) 删除图像时,为什么会出现此错误?
将第68行的代码改成这样
document.getElementById("displayname".removeChild(display[i]));
至此
document.getElementById("displayname").removeChild(display[i]);
将第 68 行替换为
document.getElementById("displayname").innerHTML = '';
removeChild()
是一种适用于节点的方法(而不是您在代码中使用的字符串或选择器)。
document.getElementById("displayname").removeChild(display[i]));
应该是合适的语法。
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);
}
这是我目前正在处理的代码。我正在创建一个网站,其中包含名字和姓氏的两个输入字段。在验证每个字段后,他们将启用提交按钮。单击提交按钮时,它将结合名字和姓氏,然后将每个字母分开并调用与输入的每个字母相关的图像并将其显示在显示名称 div 上。
这是我遇到问题的地方:
我想要的是显示图像然后删除图像并使用setInterval再次连续显示。 (即用图像拼写的名称将闪烁)。不幸的是,当我尝试使用 removeChild 函数删除图像时,我的代码出现以下错误:
更新
Uncaught TypeError: Failed to execute 'removeChild' on 'Node': parameter 1 is not of type 'Node'.
下面是检查工具的图像,其中包含错误和出现错误的行。
当我要求它使用 removeChild(display[i]) 删除图像时,为什么会出现此错误?
将第68行的代码改成这样
document.getElementById("displayname".removeChild(display[i]));
至此
document.getElementById("displayname").removeChild(display[i]);
将第 68 行替换为
document.getElementById("displayname").innerHTML = '';
removeChild()
是一种适用于节点的方法(而不是您在代码中使用的字符串或选择器)。
document.getElementById("displayname").removeChild(display[i]));
应该是合适的语法。