Question

我正在尝试将September 4之类的单词拆分为Sep 4，我不确定如何进行此操作。

我正在尝试编辑的dom看起来像这样：

<div>
   <p>September 1</p>
</div>
<div>
   <p>Date</p>
   <p>September 2</p>
</div>
<div>
   <p>Date</p>
   <p>September 3</p>
</div>
<div>
   <p>Date</p>
   <p>September 4</p>
</div>

我想我可以编辑我想要的p标签：$("div p:nth-child(2)").text()但是我不确定如何将第一个单词修剪为仅3个字符..任何想法？感谢

Answer 1

以下是如何做到这一点，将单词拆分为数组（按空格分隔），然后从第一个单词中删除字符，最后再次加入数组并添加空格：

function trimFirstWord(text, amount) {
    var wordArray = text.split(" ");
    wordArray[0] = wordArray[0].substring(0, amount);
    wordArray = wordArray.join(" ");
    return wordArray;
}

// Will be "Sep 4"
var newText = trimFirstWord("September 4", 3);

然后，您将使用.text()：

实现该方法

$("div p:nth-child(2)").text(function(){ 
    return trimFirstWord($(this).text(), 3) 
});

Answer 2

您可以定义一个处理p元素中当前文本的函数，并让它返回修改后的文本。它看起来像这样：

$("div p:nth-child(2)").text(function(i, oldtext) {
  var splitArray = oldtext.split(" ");
  return splitArray[0].substr(0,3) + " " + splitArray[1];
});

Answer 3

尝试将.text(function(index, text){})，String.prototype.match()与RegExp /(^[a-z]{3})|(\s\d+)/gi一起使用

$("div p:nth-child(2)").text(function(_, txt) {
  return txt.match(/(^[a-z]{3})|(\s\d+)/gi).join("");
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<div>
   <p>September 1</p>
</div>
<div>
   <p>Date</p>
   <p>September 2</p>
</div>
<div>
   <p>Date</p>
   <p>September 3</p>
</div>
<div>
   <p>Date</p>
   <p>September 4</p>
</div>

在dom

3 个答案: