JQuery循环切片（），split（）和包裹数组...对于类的每个元素

Question

我很确定我接近这个，但我似乎无法做到正确。我为列出的每个事件动态获取以下字符串，始终采用相同的格式。基本上需要在拆分（）关闭日期为这些条目，并只返回的时候，就是被分割（）“”和跨度呈现 这是我的本钱：

<div class="date">Di 22.10.2014 um 14:00, 18:00</div> 
<div class="date">Di 22.10.2014 um 14:00, 18:00, 20:00 </div> 

和

var data =$('.date').html().slice(17); 
var arr = data.split(','); 
$(".date").empty(); 
$.each(arr, function(i, v) { 
$('.date').append($("<span>").html(v)); 
}); 

....到目前为止好...这http://jsfiddle.net/MealaBmay/K3D6d/1088/工作，但 我意识到每个“.date”用同样的内容结束了。我似乎无法得到这个脚本转换为每个做这个... 我看着Splitting text and wrapping each of the words in elements in jQuery 并试图使用相同的方法....但叹息不断绘制一个空白......任何帮手在那里？ THX

Answer 1

使用.text()二传手版本，这需要一个回调函数

$('.date').each(function(i, text) { 
 
    var $this = $(this), 
 
    data = $this.text().slice(17); 
 
    var arr = data.split(','); 
 
    $this.empty(); 
 
    $.each(arr, function(i, v) { 
 
    $this.append($("<span>").html(v)); 
 
    }); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="date">Di 22.10.2014 um 14:00, 18:00</div> 
 
<div class="date">Di 22.10.2014 um 14:00, 18:00, 20:00</div>

---

也许另一种方式做同样的

$('.date').html(function(i, html) { 
 
    return $.map(html.trim().substring(17).split(','), function(item) { 
 
    return '<span>' + item + '</span>' 
 
    }).join('') 
 
})

.date span { 
 
    border: 1px solid lightgrey; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="date">Di 22.10.2014 um 14:00, 18:00</div> 
 
<div class="date">Di 22.10.2014 um 14:00, 18:00, 20:00</div>