如何在第一个`/`(斜杠)处拆分字符串并在`<span>`中包围它的一部分?
Posted
技术标签:
【中文标题】如何在第一个`/`(斜杠)处拆分字符串并在`<span>`中包围它的一部分?【英文标题】:How to split a string at the first `/` (slash) and surround part of it in a `<span>`? 【发布时间】:2013-05-18 16:04:38 【问题描述】:我想格式化这个日期:<div id="date">23/05/2013</div>
。
首先,我想在第一个 /
处拆分字符串,并将其余部分放在下一行。接下来,我想将第一部分包围在一个<span>
标签中,如下:
<div id="date">
<span>23</span>
05/2013</div>
23 05/2013
我做了什么:
<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>
请参阅JSFiddle。
但这不起作用。有人可以帮我处理 jQuery 吗?
【问题讨论】:
你的小提琴没有被jQuery
引用这里更新jsfiddle.net/K3D6d/2
【参考方案1】:
使用split()
片段:
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
当你在/
上拆分这个字符串--->
23/05/2013
var myString = "23/05/2013";
var arr = myString.split('/');
你会得到一个大小为3
的数组
arr[0] --> 23
arr[1] --> 05
arr[2] --> 2013
【讨论】:
你也可以像这样缩短脚本:var arr = $('#date').text().split('/');
谢谢,阿迪尔。你的答案值得放弃。谢谢。【参考方案2】:
与其使用固定索引的子字符串,不如使用replace
:
$("#date").html(function(t)
return t.replace(/^([^\/]*\/)/, '<span>$1</span><br>')
);
一个优点是,如果第一个 /
位于不同的位置,它仍然可以工作。
这种结构的另一个优点是它可以扩展到多个元素,例如所有实现类的元素,只需更改选择器即可。
Demonstration(请注意,我必须在 jsfiddle 窗口左侧的菜单中选择 jQuery)
【讨论】:
【参考方案3】:你应该使用 html():
SEE DEMO
$(document).ready(function()
$("#date").html('<span>'+$("#date").text().substring(0, 2) + '</span><br />'+$("#date").text().substring(3));
);
【讨论】:
【参考方案4】:试试
date.innerHTML= date.innerHTML.replace(/^(..)\//,'<span>$1</span></br>')
<div id="date">23/05/2013</div>
【讨论】:
【参考方案5】:使用这个
<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>
【讨论】:
这不起作用。你打电话给.text
x
?你确定吗?【参考方案6】:
试试这个
$("div#date").text().trim().replace(/\W/g,'/');
DEMO
看一个正则表达式 http://regexone.com/lesson/misc_meta_characters
享受我们 ;-)
【讨论】:
【参考方案7】:var str = "How are you doing today?";
var res = str.split(" ");
这里的变量“res”是一种数组。
你也可以明确地声明它为
var res[]= str.split(" ");
现在您可以访问数组的各个单词。 假设你想访问数组的第三个元素,你可以通过索引数组元素来使用它。
var FirstElement= res[0];
现在变量 FirstElement 包含值“How”
【讨论】:
以上是关于如何在第一个`/`(斜杠)处拆分字符串并在`<span>`中包围它的一部分?的主要内容,如果未能解决你的问题,请参考以下文章