简洁地将每个单词包裹在 span 标签中

问题描述

我正在尝试创建一个内联/可复制粘贴的匿名函数,我可以插入浏览器控制台以将页面中的每个单词包装在 span 元素中。

这是我尝试过的:

(function() {
    document.querySelectorAll("*").each(function() {
        var text = this.text();
        var words = text.split(' ');
        this.innerHTML = '';
      
        for(let word of words) {
          this.innerHTML = word.replace(/(\w+)/g,"<span>$1</span>");
        }
    })
})();

有什么方法可以让它发挥作用吗?

解决方法

我针对 P 标签对其进行了测试,并且可以正常工作。我不建议为所有元素运行它:|

(function() {
  var elements = document.querySelectorAll("p");
  try {
    for (i = 0; i < elements.length; i++) {
      var text = elements[i].innerHTML;
      var words = text.split(' ');
      elements[i].innerHTML = '';
      for (let word of words) {
        elements[i].innerHTML += word.replace(/(\w+)/g,"<span>$1</span>");
      }
    }
  } catch {}
})();