Javascript JS：第一次调用后调用的函数会导致空错误

我只是在玩，去看了CNN的文章，在控制台上运行了这段代码。其想法是能够单击

p

元素，并将DOM节点替换为包含反向文本的节点。它按预期工作，但只工作一次。当我尝试再次运行它以将其反转回来时，控制台中出现错误，我无法说出原因：

TaggedEventTracker.js:56 Uncaught TypeError: Cannot read property 'dataset' of null
    at e.findNearestZjsOrAElement (TaggedEventTracker.js:56)
    at e.findNearestZjsOrAElement (TaggedEventTracker.js:63)
    at e.trackTaggedEvent (TaggedEventTracker.js:73)
    at HTMLDocument.<anonymous> (TaggedEventTracker.js:17)

---

为什么要创建一个新节点来替换旧节点？您可以只替换原始元素的innerHTML

替换元素时，它们的事件跟踪器似乎已损坏

此外，通过替换节点，还可以替换与其关联的事件处理程序

让段落=document.querySelectorAll（'p'）；
段落。forEach（段落=>{
para.onclick=函数（evt）{
updateText（evt.target）
}
})
函数updateText（目标）{
target.innerHTML=[…target.innerHTML].reverse（）.join（“”）；
}

`123456789

`123456789

`123456789

如果您想交换其中的文本，这就是所需的全部内容。不要使用innerHTML，而是使用textContent

let paragraphs = document.querySelectorAll('p');

paragraphs.forEach(para => {
   para.onclick = function(evt) {
       updateText(evt.target)
   }
})


function updateText(target) {

     let node = target;

     node.textContent =  [...target.textContent].reverse().join("");
}

---

代码中没有数据集，所以。。。。。错误实际来自何处？当您替换节点时，您可能正在删除它们用于跟踪单击事件的任何数据属性。我知道我可以为该用例操作现有节点。我只是想练习更换nodes@hortenzz1，他们的网站可能在段落标签上有用于事件跟踪的数据属性。当您用自己的节点替换节点时，这些跟踪属性不会被复制。哦，这很有意义！看起来你在回答中提到了这一点，所以我将选择这个作为解决问题的方法。感谢you@hortenzz1，我也意识到了另外一件事。替换节点时，您正在删除与原始节点关联的事件处理程序。@hortenzz1我知道您接受了我的答案，但是我为您添加了更多的信息，而且我很可能通过替换节点来解决问题本身。

textContent

保留了间距和样式，但我希望避免这种情况

let paragraphs = document.querySelectorAll('p');

paragraphs.forEach(para => {
   para.onclick = function(evt) {
       updateText(evt.target)
   }
})


function updateText(target) {

     let node = target;

     node.textContent =  [...target.textContent].reverse().join("");
}