Javascript Regexp将每个单词包装在HTML页面上

是否可以在HTML页面上用span元素包装每个单词？ 我在尝试类似的东西

/(\s*(?:<\/?\w+[^>]*>)|(\b\w+\b))/g

/（\s*（？：]*>）|（\b\w+\b））/g

但结果远远不是我所需要的

---

提前谢谢

我不想问原因，你可以这样做：

function getChilds( nodes ) {
    var len = nodes.length;

    while( len-- ) {
        if( nodes[len].childNodes && nodes[len].childNodes.length ) {
            getChilds( nodes[len].childNodes );
        }

        var content = nodes[len].textContent || nodes[len].text;

        if( nodes[len].nodeType === 3 ) {
            var parent = nodes[len].parentNode,
                newstr = content.split(/\s+/).forEach(function( word ) {
                    var s = document.createElement('span');
                    s.textContent = word + ' ';

                    parent.appendChild(s);
                });

            parent.removeChild( nodes[len] );
        }
    };
}

getChilds( document.body.childNodes );

---

即使我不得不承认我还没有测试代码。这只是我想到的第一件事。可能是有问题或者完全搞砸了，但在这种情况下，我知道温和善良的stackoverflow社区会狠狠地揍我一顿，让我一败涂地。在不特定于标记的情况下，您实际上需要遍历页面上的每个元素，将其包装并重新附加

---

话虽如此，试着做一些类似于帖子所使用的东西（少为4个以上字符的单词制作fitler，并将字母混合在一起）。

要从当前页面获取span标记之间的所有单词，您可以使用：

var spans = document.body.getElementsByTagName('span');
if (spans)
{
  for (var i in spans)
  {
    if (spans[i].innerHTML && !/[^\w*]/.test(spans[i].innerHTML))
    {
      alert(spans[i].innerHTML);
    }
  }
}
else
{
  alert('span tags not found');
}

---

您可能应该首先获取文档中的所有文本节点，并处理它们的内容，而不是将HTML作为普通字符串处理。这实际上取决于您使用的语言，但通常可以使用像

//text（）

这样的简单XPath来实现这一点

在JavaScript中，这将是

document.evaluate（'//text（）'，document.body，null，XPathResult.ORDERED\u NODE\u SNAPSHOT\u TYPE，null）

，而不是迭代结果并分别处理每个文本节点。

我是这样做的，可能需要一些调整

var wrapWords = function(el) {
    var skipTags = { style: true, script: true, iframe: true, a: true },
        child, tag;

    for (var i = el.childNodes.length - 1; i >= 0; i--) {
        child = el.childNodes[i];
        if (child.nodeType == 1) {
            tag = child.nodeName.toLowerCase();
            if (!(tag in skipTags)) { wrapWords(child); }
        } else if (child.nodeType == 3 && /\w+/.test(child.textContent)) {
            var si, spanWrap;
            while ((si = child.textContent.indexOf(' ')) >= 0) {
                if (child != null && si == 0) {
                    child.splitText(1);
                    child = child.nextSibling;
                } else if (child != null) {
                    child.splitText(si);
                    spanWrap = document.createElement("span");
                    spanWrap.innerHTML = child.textContent;
                    child.parentNode.replaceChild(spanWrap, child);
                    child = spanWrap.nextSibling;
                }
            }
            if (child != null) {
                spanWrap = document.createElement("span");
                spanWrap.innerHTML = child.textContent;
                child.parentNode.replaceChild(spanWrap, child);
            }
        }
    }
};

wrapWords(document.body);

---

你真的不能用正则表达式解析HTML，只有Chuck Norris可以。当然事实上，有时候你甚至应该。然而，Javascript拥有任何编程语言中最可怕的正则表达式。

XRegExp

插件有帮助，但仍然很糟糕。教一头猪唱歌更容易，也不那么烦人。要么都是真的™ 在服务器端工作，您可以使用真实的™ 编程语言，或者准备为无伴奏的猪合唱团即兴创作一首6声赋格曲。谢谢各位，看来我需要寻找一个方向来获取所有文本节点并使用它们。我的理解不是根据它们是否已经在一个跨度内进行筛选，而是让每个单词本身都被包装在一个新的跨度内。。。也许我误解了？这是一个有趣的话题，不是吗？为什么这行：

var each=Array.prototype.forEach？这似乎没有什么意义。是的，第一行很混乱，你能解释一下吗？无论如何，经过一些修改，这解决了我的问题。谢谢@布罗克：耶，你说得对。这是进一步版本的遗留问题。我把它取下来。