gpt4 book ai didi

JavaScript removeChild 帮助

转载 作者:可可西里 更新时间:2023-11-01 13:17:03 26 4
gpt4 key购买 nike

我正在编写一小段简单的代码来在鼠标位于框中的任何位置绘制像素。我也想要一个清除按钮。绘图工作正常,但我似乎无法使用清除按钮。以下是我的 .js 文件的相关部分:

function pixel(x, y) {
var pix = document.createElement("div");
pix.setAttribute("style", "position:absolute;left:" + x + "px;top:" +
y + "px;width:3px;height:3px;background:#000;cursor:crosshair");
return pix;
}

var mouseDown = false;

function draw(event) {
if (!mouseDown) return;
var x = event.clientX;
var y = event.clientY;
document.getElementById("box").appendChild(pixel(x, y));
}

/* Neither 1, 2, nor 3 work! */
function clear() {
var box = document.getElementById("box");
/* 1 */
// box.innerHTML = "";
/* 2 */
// box.childNodes = new NodeList();
/* 3 */
for (n in box.childNodes)
box.removeChild(n);
}

我的 HTML 文件的相关部分是:

<body onmousedown="mouseDown=true" onmouseup="mouseDown=false">
<div id="box" onmouseover="document.getElementById('box').style.cursor='crosshair'"
onmousemove="draw(event)"></div>
<button onclick="clear()">Clear</button>
</body>

该框也使用 CSS 进行了一些格式化,但这应该不是问题。我觉得问题可能是我正在从框中删除像素而不是从文档或其他东西中删除像素,但我是 JavaScript 菜鸟所以我不知道。

最佳答案

将您的函数重命名为其他名称(不是 clear())。

function removePixels() {
var box = document.getElementById("box");

if (box.hasChildNodes() )
{
while ( box.childNodes.length >= 1 )
{
box.removeChild( box.firstChild );
}
}

}//end function

关于JavaScript removeChild 帮助,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6157699/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com