D3.js开发求助：无法获取this.parentNode，求解决方向

刚接触D3.js就开始修改现有脚本，确实容易踩一些指向相关的坑，我来帮你理理可能的解决方向：

首先看你的代码片段，你是在d3.line()生成器的y回调函数里尝试获取this.parentNode对吧？这里有个核心误解：D3线生成器的x/y回调里的this，指向的是当前遍历的数据对象（也就是每个d），而不是DOM元素，所以这里肯定拿不到parentNode属性，这是问题的根源。

接下来给你几个具体的解决思路：

• 直接使用已传入的svgElement参数：你的lines函数已经接收了svgElement参数，如果你要访问的是线所在的SVG父容器，直接用这个变量就可以，完全不用通过this去获取。
• 在DOM元素的回调里获取父节点：如果你是想操作绘制完成后的线元素的父容器，应该把获取父节点的逻辑放在线元素的绑定/绘制阶段。比如当你用svg.selectAll('path').data(data).enter().append('path').attr('d', Line)的时候，在这个链式调用的回调（比如.attr()或者.on()的回调）里，this才会指向对应的path DOM元素，这时候this.parentNode就能正常拿到父容器了。
• 适配D3版本的指向变化：如果你用的是D3 v6及以上版本，在元素回调里，除了用普通函数的this，还可以通过回调的第三个参数来获取当前元素：

  // 比如在元素的事件回调里
  .on('click', function(d, i, nodes) {
    const currentElement = nodes[i];
    const parentNode = currentElement.parentNode;
    // 这里就可以操作父节点了
  })
  

• 先确认this的实际指向：可以在你出错的回调里加一句console.log(this)，看看它到底指向什么（应该是当前的数据对象），这样能更清晰地理解问题所在。

内容的提问来源于stack exchange，提问作者user9607155