javascript - 有没有办法将类添加到特定类的第一个单词？

Question

我正在寻找一种方法来将自定义类添加到特定类的第一个和第二个单词？

我的代码是这样的

<h2 class="content-heading">Latest News</h2>

我想有类似的东西

<h2 class="content-heading"><span class="1">Latest</span> <span class="2">News</span></h2>

Answer 1

您可以使用函数设置 html，然后将 innerText 和 map 拆分 到 跨度。

$('.content-heading').html(function() {
  return this.innerText.split(' ').map(function(e, i) {
    return $('<span />', {
      class: 'i' + i,
      text: e
    });
  });
});

.i0 {
  color:red;  
}

.i1{
   color:blue; 
 }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<h2 class="content-heading">Latest News</h2>

注意:类必须是 SGML 名称。因此，我在示例中使用了 i 前缀。