jQuery 如何在第一个`/`（斜杠）处拆分字符串并将其部分包围在`<span>`中？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16711504/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to split a string at the first `/` (slash) and surround part of it in a `<span>`?
提问by Mustapha Aoussar
I want to format this date: <div id="date">23/05/2013</div>.
我想格式化这个日期：<div id="date">23/05/2013</div>.
First I want to split the string at the first /and have the rest in the next line. Next, I'd like to surround the first part in a <span>tag, as follows:
首先，我想在第一行拆分字符串，/并将其余部分放在下一行。接下来，我想将第一部分括在<span>标签中，如下所示：
<div id="date">
<span>23</span>
05/2013</div>
23 05/2013
23 05/2013
What I did:
我做了什么：
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="date">23/05/2013</div>
<script type="text/javascript">
$(document).ready(function() {
$("#date").text().substring(0, 2) + '<br />';
});
</script>See the JSFiddle.
请参阅JSFiddle。
But this does not work. Can someone help me with jQuery?
但这不起作用。有人可以用 jQuery 帮助我吗？
回答by Mohammad Adil
Using split()
使用 split()
Snippet :
片段：
var data =$('#date').text();
var arr = data.split('/');
$("#date").html("<span>"+arr[0] + "</span></br>" + arr[1]+"/"+arr[2]); <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="date">23/05/2013</div>Fiddle
小提琴
When you split this string --->23/05/2013on /
当您拆分此字符串--->23/05/2013时/
var myString = "23/05/2013";
var arr = myString.split('/');
you'll get an array of size 3
你会得到一个大小的数组 3
arr[0] --> 23
arr[1] --> 05
arr[2] --> 2013
回答by Denys Séguret
Instead of using substring with a fixed index, you'd better use replace:
与其使用具有固定索引的子字符串，不如使用replace：
$("#date").html(function(t){
return t.replace(/^([^\/]*\/)/, '<span></span><br>')
});
One advantage is that it would still work if the first /is at a different position.
一个优点是，如果第/一个位置不同，它仍然可以工作。
Another advantage of this construct is that it would be extensible to more than one elements, for example to all those implementing a class, just by changing the selector.
这种结构的另一个优点是它可以扩展到多个元素，例如扩展到所有实现一个类的元素，只需更改选择器即可。
Demonstration(note that I had to select jQuery in the menu in the left part of jsfiddle's window)
演示（请注意，我必须在 jsfiddle 窗口左侧的菜单中选择 jQuery）
回答by A. Wolff
回答by Kamil Kie?czewski
try
尝试
date.innerHTML= date.innerHTML.replace(/^(..)\//,'<span></span></br>')<div id="date">23/05/2013</div>回答by KingRider
Try this
尝试这个
$("div#date").text().trim().replace(/\W/g,'/');
Look a regular expression http://regexone.com/lesson/misc_meta_characters
看一个正则表达式 http://regexone.com/lesson/misc_meta_characters
enjoy us ;-)
享受我们;-)
回答by Anand Shah
use this
用这个
<div id="date">23/05/2013</div>
<script type="text/javascript">
$(document).ready(function(){
var x = $("#date").text();
x.text(x.substring(0, 2) + '<br />'+x.substring(3));
});
</script>
回答by Mike Clark
var str = "How are you doing today?";
var res = str.split(" ");
Here the variable "res" is kind of array.
这里变量“res”是一种数组。
You can also take this explicity by declaring it as
您也可以通过将其声明为
var res[]= str.split(" ");
Now you can access the individual words of the array. Suppose you want to access the third element of the array you can use it by indexing array elements.
现在您可以访问数组的各个单词。假设您要访问数组的第三个元素，您可以通过索引数组元素来使用它。
var FirstElement= res[0];
Now the variable FirstElement contains the value 'How'
现在变量 FirstElement 包含值 'How'
