如何用br替换找到的第一个空格

How to replace the first space found with a br?

本文关键字：第一个 空格 何用 br 替换      更新时间：2023-09-26

我得到了一个字符串

Hello/Greetings My name is Rolf

HTML版本

<ul class="options-list"><li><span class="label"><label for="options_168_1">Hello/Greetings My name is Rolf </label></span></li></ul>

我想做的是在找到第一个空格后添加一个分隔符（就在你好/问候之后），或者在标签中包含"你好/问候"。。。

对我来说，唯一的解决方案是JS或一些黑客（如果有的话）CSS（没有找到任何可以帮助我的）。。。

jQuery如何实现这一点？

如果你想对所有标签都这样做，你可以这样做：

$("label").each(function(){
  var $elem = $(this);
  $elem.html($elem.text().replace(' ','<br/>'));
});

否则，我会给标签一个id，然后做这样的事情：

var $elem = $('#myLabel');
$elem.html($elem.text().replace(' ','<br/>'));

var str = 'Hello/Greetings My name is Rolf';
str.replace(/'s/,'<br>');

因此，如果您想使用class="label"访问包含在<span>中的文本，可以使用以下jQuery：

$('span.label').text()

但是，由于class不针对一个元素，就像使用id一样，我们需要更加具体。正如我们在您的代码片段中所看到的，span元素位于<li>中，具有与我们相同的逻辑：

$('li span.label').text()

但这还不够具体，让我们考虑<ul>元素和class="options-list"，这给了我们：

$('ul.options-list li span.label').text()

现在，您想用<br>html元素替换在所述文本中找到的第一个"（空格字符），只需使用：

$('ul.options-list li span.label').text().replace(" ", "<br />")

现在要使用替换的结果，由于它是html而不仅仅是纯文本，我们需要使用html()函数，如下所示：

$('ul.options-list li span.label').html($('ul.options-list li span.label').text().replace(" ", "<br />"));

但是要考虑到它并不能取代空间，特别是因为没有id，所以它没有任何东西可以让我们在DOM中精确定位特定的span元素，所以这意味着，如果你想在特定的<span>中对该空间进行特定的更改，你需要使用id

<span id="label">blablabla second line</span>

然后你可以使用这个更干净的jQuery代码：

$('#label').html($('#label').text().replace(" ", "<br />"));

但是要注意：id在DOM中只能出现一次；它是唯一

但是，如果您不想要或不能使用id，那么我之前给您的jQuery将替换DOM中所有<ul class="options-list"><li><span class="label"> ... </ul>中的第一个空间。

希望它足够清楚：）

这并不完美，但它完成了任务：

var str = "Hello/Greetings My name is Rolf";
var brPos = str.indexOf(" ");
str = str.substr(0, 15) + "<br>" + str.substr(16, str.length);
相关文章：