Question

我能够用span标签替换标点符号并将句子分开，但我尝试将每个句子的id增加1，它只对第一个句子起作用。

$('.whatever').each(function(index) {
     var sentences = $(this).html().replace(/([^.!?]*[^.!?\s][.!?]['"]?)(\s|$)/g, 
     '<span id="'+index+'">$1</span>$2<SENTENCE_END>');
     $(this).html(sentences);
});

感谢您的任何想法。

Answer 1

如果您的所有文字都在#whatever内，则您需要先按句点拆分文字，然后再遍历每个文字以添加<spans>。

以下是一个例子：

// set counter
var j = 0;

// get text from div
var sentences = $('#whatever').text().trim();

// split text by "."
var sentences = sentences.split('.');

// empty the output div
$('#whatever').empty();

// for each sentence, check for blank sentence,
// add span with counter number, trim spaces,
// add leading space if this is not the first sentence,
// add "." at the end of sentence, output to div
$(sentences).each(function () {
    if (this.trim()!='') {
        $('#whatever').append( (j>0?" ":"") + '<span class="sentence" id="sentence_' + j + '">' + this.trim() + '.</span>');
        j++;
    }
});

http://jsfiddle.net/FrDzL/1/

Answer 2

为什么使用id选择器？ id选择器$('#whatever')仅选择一个元素（与页面上的id匹配的第一个元素）。因此，每个循环只执行一次（这就是为什么它只在第一个循环中起作用）。修改你的html代码以使用类，并选择使用$（'。whatever'）。

ID选择器（“＃id”）

选择具有给定id属性的单个元素。

来源：http://api.jquery.com/id-selector/

Answer 3

尝试以下

HTML

<p class="whatever">hej</p>
<br>
<p class="whatever">hej</p>
<br>
<p class="whatever">hej</p>

JS

var j = 0;

$('.whatever').each(function() {
     var sentences = $(this).html().replace('hej','nej');
     j++;
     $(this).html(sentences);
});

JSFiddle

最后，为您的示例工作代码

var j = 0;

$('.whatever').each(function() {
    var sentences = $(this).html().replace(/([^.!?]*[^.!?\s][.!?]['"]?)(\s|$)/g, 
 '<span class="sentence" id="'+j+'">$1</span>$2<SENTENCE_END>');
    j++;
    $(this).html(sentences);
});

如何为段落中的每个句子添加递增ID？

3 个答案: