我目前在嘗試為foreignObject使用 vanilla JS 呈現(xiàn)的某些s添加單擊事件偵聽器時(shí)遇到一些問題。當(dāng)我在點(diǎn)擊功能上使用內(nèi)置的 d3 時(shí)，它可以工作，但我更愿意使用 javascript 代碼完成它。但是，該函數(shù)永遠(yuǎn)不會(huì)為這些元素觸發(fā)，我不明白為什么。代碼示例不完整，但應(yīng)該突出顯示我正在嘗試做的事情。var nodes = g.selectAll("foreignObject")    .data(response.nodes)    .enter()    .append("foreignObject")    .attr("x", function(d) {        return d.x - nodeWidth / 2;    })    .attr("y", function(d) {        return d.y - nodeHeight / 2;    })    .attr("width", nodeWidth)    .attr("height", nodeHeight)    .append("xhtml:div")    .attr("class", "outer")    .html(function(d) {         var nodeHtml = createNodeElement(d);        return nodeHtml.outerHTML;    })   // If I append the img like this, it works, but ends up in the wrong "element scope"   .append("img")        .attr("class", "optionsImg")        .attr("src","/images/options-squares.svg")        .on("click", function(d) {            currentTooltipObject = d;            renderTooltipDiv();        });function createNodeElement(d) {    let nodeElement = document.createElement("div");    nodeElement.className = "nodeElement";    let nodeOptionsImg = document.createElement("img");    nodeOptionsImg.className = "nodeOptionsImg";    nodeOptionsImg.src = "/images/options-squares.svg";    nodeOptionsImg.addEventListener("click", function() {        console.log("Clicked on optionsImg for this object: "+d);    });    nodeElement.appendChild(nodeOptionsImg);    return nodeElement;}