javascript - 使用 mouseover div 显示消息时出错

Question

var hello = document.createElement('<div>HELLO</div>');
var wrapper = document.getElementById('wrapper');

document.getElementsByTagName('span')[0].appendChild(hello);

wrapper.addEventListener('mouseover', mouseMove, false);
setTimeout(function(){
   document.getElementsByTagName('span')[0].removeChild(hello);
   wrapper .removeEventListener('mouseover', mouseMove, false);
}, 10000);

<div id="wrapper">
</div>

当我继续前进时 <div id="wrapper"></div> 结果为空

当我移动时如何在 10 秒<div id="wrapper"></div>内显示结果HELLO，如何解决它

Answer 1

这应该有效：

var wrapper = document.getElementById('wrapper');

function createHelloDiv() {
    var hello = document.createElement('div');
    var helloContents = document.createTextNode('hello');
    hello.appendChild(helloContents);
    return hello;
}

function onMouseOver() {
    setTimeout(function() {
        wrapper.appendChild(createHelloDiv());
        wrapper.removeEventListener('mouseover', onMouseOver, false);
    }, 10000);
}

wrapper.addEventListener('mouseover', onMouseOver, false);

有关工作示例，请参见此小提琴。

Answer 2

你想达到什么目的？

这部分代码

wrapper.addEventListener('mouseover', mouseMove, false);

将鼠标 overevent 绑定到函数 mouseMove ，这在您的上下文中不存在。

添加

function mouseMove()
{
  alert();
}

这不会给你空...

在第二种情况下，请说明您想要实现什么？