24

我被引导到 GitHub ( https://github.com/cowboy/javascript-linkify ) 上的 Linkify 项目，以查找和“链接”只是在文本中浮动的 URL 和域。

这很棒！它完全适用于文本！

但是，我不太确定如何使它适用于textNode具有我想要链接的文本的文本。

我知道textNode唯一textContent的......它都是文字。由于此 Linkify 函数将 HTML 作为文本返回，有没有办法获取一个 textNode 并使用 Linkify 输出“重写”其中的 HTML？

我一直在 JSFiddle 上玩它：http: //jsfiddle.net/AMhRK/9/

function repl(node) {
  var nodes = node.childNodes;
  for (var i = 0, m = nodes.length; i < m; i++) {
    var n = nodes[i];
    if (n.nodeType == n.TEXT_NODE) {
      // do some swappy text to html here?
      n.textContent = linkify(n.textContent);
    } else {
      repl(n);
    }
  }
}
4

2 回答 2

26

您需要将 textNode 替换为 HTML 元素，例如 span，然后将链接文本设置为该元素的 innerHTML。

var replacementNode = document.createElement('span');
replacementNode.innerHTML = linkify(n.textContent);
n.parentNode.insertBefore(replacementNode, n);
n.parentNode.removeChild(n);
于 2013-03-21T17:11:01.397 回答
10

除了先前的答案，我还提出了更短的方法（基于 jQuery）：

$(n).replaceWith('Some text with <b>html</b> support');

其中n- 是文本节点。

或者原生版本

var txt = document.createElement("span");
txt.innerHTML = "Some text with <b>html</b> support";
node.replaceWith(txt);

node文本节点在哪里

于 2017-02-02T17:11:35.300 回答