3

想象一下这个场景：

<span>Item 1</span> | <span>Item 2</span>

如何定位 | 并删除它？另外，假设我总是需要删除 | 在其中span包含“第 2 项”之前，列表可以随着在“第 2 项”之前或之后添加的项目而增长。所有新项目都将包含在span其中，并用 | 分隔。

4

6 回答 6

4 
$('span').each(function() {
    if ($(this).text() == 'Item 2') {
        $(this.previousSibling).remove();
    }
});

http://jsfiddle.net/spFUG/2/

于 2013-02-27T22:13:03.700 回答
2

操作文本节点是 jquery 不完全擅长的事情之一。顺便说一下，本机浏览器 API 做得很好。即使您不想经常使用它，这次您也可能应该使用它。previousSibling选择前一个节点，无论是文本节点、评论节点还是元素节点。假设它始终是您要删除的文本节点可能是安全的：

var $elem = $(":contains('Item 2')");

$elem.map(function(){ //select the preceding node to any element we want to remove
  return this.previousSibling
}).addBack() // select the original element node as well
.remove(); // remove both

请注意，这addBack是在 jQuery 1.8 中添加的。如果您使用的是旧版本，请andSelf改用。如果您只想删除文本节点，请addBack完全删除。

于 2013-02-27T22:21:12.130 回答
0

更新

这是一些直接的javascript，可以从代码中删除所有“|”

var parent = $('span').parent().get(0), children = parent.childNodes, node;

    for (node = 0;node < children.length;node++){
        if (children[node].data === " | "){
             parent.removeChild(children[node]);
        }
    }

小提琴：http: //jsfiddle.net/vg3pc/

于 2013-02-27T22:03:03.643 回答
0

.contents查找文本节点。

$("#container").contents().each(function () {
    //Text node
    if (this.nodeType === 3) {
       $(this).remove();
    }
});

http://jsfiddle.net/QQsk5/

于 2013-02-27T22:14:53.453 回答
0

span找到s的父级并与.html()一起使用.replace()。

JAVASCRIPT：

$('span:first-child').parent().html($('span:first-child').parent().html().replace(/\|/g, ''))

演示：http: //jsfiddle.net/dirtyd77/5F3kf/2/

于 2013-02-27T22:16:05.490 回答
0

抢spans。删除所有内容。放回跨度（.joined 随您选择）。

<div class='container'>
  <span>Item 1</span> | <span>Item 2</span>
</div>

.

var $c = $(".container");
var $spans = $c.find("span");
var htmlSpans = [];
$spans.each(function(){
   htmlSpans.push($(this).prop("outerHTML"));
});

$c.empty();
$c.append(htmlSpans.join(" "));

http://jsfiddle.net/u59Uz/

编辑：肮脏的黑客使用相同的逻辑来处理这个非常具体的情况。正则表达式替换在管道前后处理 0 个或多个空格。

var $c = $(".container");
var html = $c.prop("outerHTML");

$c.empty();
$c.append(html.replace(/\s*\|\s*<span>Item 2/,"<span>Item 2" ));

http://jsfiddle.net/TnXB7/1/

于 2013-02-27T22:23:57.933 回答