Javascript 如何在动态元素上添加单击事件或鼠标悬停（输入/更新/退出）？

基于此示例：

在enter/update/exit规则的帮助下，可以让D3.js中的元素（例如文本）出现和消失

 var texts = svg.selectAll(".texts")
        .data(data);

    textsExit = texts.exit().remove();

    textsEnter = texts.enter()
        .append("text")
        .attr("class", "texts");

    textsUpdate = texts.merge(textsEnter).attr("x", 10)
        .attr("y", (d, i) => 20 + i * 16)
        .text((d,i) => "Node " + (i+1) + ", name: " + d.name);

现在我想在出现的文本元素上添加一个单击事件或鼠标悬停。因此，我首先尝试添加鼠标，并将

textsUpdate

部分更改为：

     textsUpdate = texts.merge(textsEnter).attr("x", 10)
     .attr("y", (d, i) => 20 + i * 16)
      .text((d,i) => "Node " + (i+1) + ", name: " + d.name)
  .on("mouseover", function(d){ this.style.fill == "blue"});

目标是每次当我将鼠标移到新出现的元素上时，它们都应该变成蓝色。 不幸的是，这并不奏效。谁能帮我一下，给我一个关于丢失的东西的提示吗

---

谢谢

在访问.text（…）之后和使用.on（…）访问之前，您正在停止对textUpdate的访问。在.on.

this.style.fill==“blue”}之前有一个额外的分号：它不应该是
this.style.fill=“blue”}？你说得对，成功了。你能用一种我能接受你答案的方式发帖子吗？目前我无法接受你的回答嘿，我只是用额外的分号编辑了这个部分。但其余的对我来说很好。它也适用于原始帖子