Question

我有一个锚元素，如下所示： <a href='/somewhere' class='break'>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ornare.</a>

它可能会说各种各样的事情，但通常会有相同的词语。我想在单词<br/>之前动态插入换行符amet（在此示例中）。

最好的方法是什么？

Answer 1

试试这个：

＆＃13;

$('#btnBreak').click(function(){
  $('.break').html($('.break').text().split('amet').join('amet <br />'));
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href='/somewhere' class='break'>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ornare.</a>

<button id="btnBreak">Break it</button>

＆＃13;

.split()将

将字符串拆分为子字符串数组

https://www.w3schools.com/jsref/jsref_split.asp

.join()

...将数组的元素连接成一个字符串，并返回该字符串。元素将由指定的分隔符分隔。默认分隔符是逗号（，）。

https://www.w3schools.com/jsref/jsref_join.asp

JavaScript中的

注意 .replace()只会替换字符串的第一个，除非分隔符是正则表达式

Answer 2

你可以通过Regex（正则表达式）来解决这个问题考虑你锚（并给它一个简化的ID）

<a href='/somewhere' id='break'>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ornare.</a>

$('#break')html($(#break).html().replace(/(amet)/g,'<br/>$1'));

这样做是为了在整个文本中搜索确切的世界amet，并用换行符+你想要的单词替换它，在这种情况下是amet。我建议W3Schools了解有关正则表达式的更多信息，并Regex101更轻松地测试正则表达式。

解析一行文本并在给定单词之前动态插入换行符？

2 个答案: