Question

data-color =＆＃34; red＆＃34;我想在span标签之前和之后2个字。
这是我的 HTML代码：

<p>This pathway has an inner and an outer wall. The pressure <span data-color="red" class="highlight">inside the</span> eye closes the tunnel.</p>

我希望输出像这样=＆gt;

The pressure <span data-color="red" class="highlight">inside the</span> eye closes

span标记中的

注意属性更改

Answer 1

您可以获取.highlight元素的上一个和下一个兄弟，并对textNodes进行切片：

function get(el, dir) {
        var ps = el[dir === 'prev' ? 'previousSibling' : 'nextSibling'];
        if (!ps || ps.nodeType !== 3) return '';
        var arr = ps.nodeValue.trim().split(/\s+/g);
        return dir == 'prev' 
               ? arr.slice(-2).join(' ') 
               : arr.slice(0, 2).join(' ');
    }

$('p').has('.highlight').html(function () {
    var e = $('.highlight', this).get(0);
    return get(e, 'prev') + ' ' + e.outerHTML + ' ' + get(e, 'next');
});

http://jsfiddle.net/kzx6zhkg/

Answer 2

你可以这样做

var elem = $('p');
var html = elem.find('span')[0].outerHTML;
var result = elem.html().match(new RegExp("(\\w+\\s+){2}" + html + "(\\s+\\w+){2}"))[0];

DEMO

在jquery中获取span标记的前2个和后2个单词

2 个答案: