0

我想在每个不属于 html 标记的斜杠 (/) 字符之后添加一个空格。因此，如果元素的内容如下所示：

<strong>Occupational/technical/eduction/training program:</strong><br />
Started before 1/1/12.<br />
More text <i>description</i> more/text/with/slashes.

我想在每个斜线后添加一个空格，但不要在结束标记（如 </strong>）或中断 <br /> 标记中添加斜线，因为在标记中的斜线后添加空格会导致浏览器错误地呈现它们。

现在，我有：

jQuery("table tr td:nth-child(2)").each(function() {
    var tdContent = jQuery(this).html();
    slashSpace = tdContent.replace(/\//g, "/ ");
    $(this).empty().append(slashSpace);

});

关闭，但这会为所有斜线增加空间，包括 html 标记。我设置了这个 jsFiddle：http: //jsfiddle.net/Ejp4r/。如您所见，在结束标记中添加空格会错误地呈现第二个单元格。

似乎它应该相当容易，但我正在画一个空白。有任何想法吗？

4

4 回答 4

4

您的正则表达式只需要显式匹配未被<or包围的斜线>：

tdContent.replace(/([^<])\/([^>])/g, "$1/ $2");

在正则表达式中，[^...]表示“匹配不在此集中的字符”。正则表达式现在将匹配*/*，但不匹配</or />。

作品。

于 2013-05-22T17:32:48.947 回答
2

除了使用正则表达式，您可以遍历文本节点以应用需要更改的内容：

var textNodes = function textNodes(parent, cb) {
  [].slice.call(parent.childNodes).forEach(function (node) {
    switch (node.nodeType) {
      case 1: textNodes(node, cb); break;
      case 3: cb(node); break;
    }
  });
};

$('table').each(function () {
  textNodes(this, function (node) {
    node.nodeValue = node.nodeValue.replace(/\//g, '\/ ');
  });
});

http://jsbin.com/ohezud/2/

于 2013-05-22T17:41:52.450 回答
0

尝试使用.text(...)而不是.html(...)像这样的FIDDLE

于 2013-05-22T17:30:18.847 回答
0

如果你不想弄乱正则表达式，试试这个：

$("table tr td:nth-child(2)").each(function() {

    var children = $(this).find();

    if( children.length > 0 ) {
        children.each(function(){
            $(this).html( $(this).html().replace(/\//g, "/ ") ); 
        });
    } else {
        $(this).html( $(this).html().replace(/\//g, "/ ") );
    }

});
于 2013-05-22T17:45:30.700 回答