点击<td>元素无法获取data-id属性值，返回undefined的问题

问题出在箭头函数的this指向上：箭头函数不会绑定自身的this，它的this继承自外层上下文，所以这里的$(this)并不是被点击的<td>元素，自然获取不到data-id属性。

修复方法有两种： #

方法1：改用普通函数作为事件回调

普通函数的this会自动指向触发事件的DOM元素：

$(document).on('click', '#table-content td', function(e) {
   console.log("td onclick called")
   console.log($(this).attr('data-id')); // 输出"test"
   // 也可以用jQuery的data方法
   console.log($(this).data("id")); // 同样输出"test"
});

方法2：继续用箭头函数，通过事件对象获取目标元素

借助事件参数e的currentTarget属性（确保指向绑定事件的td，避免事件冒泡时拿到子元素）：

$(document).on('click', '#table-content td', e => {
   console.log("td onclick called")
   const $td = $(e.currentTarget);
   console.log($td.attr('data-id'));
   console.log($td.data("id"));
});

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