如何使用jQuery将段落最后一个单词包裹在span标签中

嘿，这个需求很好实现，我来给你详细拆解逻辑，再附上可直接用的代码：

核心实现逻辑 #

要完成这个需求，本质上就是拆分文本内容→定位最后一个单词→用span包裹后重新拼接，具体分这几步：

• 第一步：获取到目标<p>元素，拿到它的文本内容
• 第二步：把文本按空格拆分成单词数组（要处理多个连续空格的情况）
• 第三步：取出数组里的最后一个单词，用<span>标签包裹它
• 第四步：把剩下的单词重新拼接成字符串，再和包裹好的最后一个单词组合，替换掉原段落的内容

原生JavaScript代码示例 #

这是最通用的实现方式，不需要依赖任何库：

// 选中目标段落（如果有多个p，建议给目标p加class或id来精准选择）
const targetPara = document.querySelector('p');
// 获取段落文本并去除首尾多余空格
const paraText = targetPara.textContent.trim();
// 按任意数量的空格拆分单词，避免多个空格导致的空数组项
const wordList = paraText.split(/\s+/);

// 处理段落为空或只有一个单词的边界情况
if (wordList.length > 0) {
  const lastWord = wordList.pop();
  // 重新拼接内容，注意保留空格
  const newHtmlContent = `${wordList.join(' ')} <span>${lastWord}</span>`;
  // 更新段落的HTML内容
  targetPara.innerHTML = newHtmlContent;
}

补充说明 #

• 如果你的段落里最后一个单词带有标点（比如你的例子里的augue.），这段代码也能直接处理，因为拆分的时候会把带标点的整个内容当作最后一个单词
• 如果需要处理更复杂的标点场景（比如最后是感叹号、问号等），这段代码同样适用，因为它不针对特定标点做判断，只是单纯处理最后一个空格分隔的内容

内容的提问来源于stack exchange，提问作者cup_of