วิธีการแยกสตริงที่ `/` (ทับ) ครั้งแรกและล้อมรอบส่วนของมันใน `<span> 'ได้อย่างไร

<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

การใช้ 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>

ซอ

เมื่อคุณแยกสตริงนี้---> 23/05/2013บน/

var myString = "23/05/2013";
var arr = myString.split('/');

คุณจะได้ขนาดที่หลากหลาย 3

arr[0] --> 23
arr[1] --> 05
arr[2] --> 2013

แทนที่จะใช้ซับสตริงที่มีดัชนีตายตัวคุณควรใช้replace:

$("#date").html(function(t){
    return t.replace(/^([^\/]*\/)/, '<span>$1</span><br>')
});

ข้อดีอย่างหนึ่งก็คือว่ามันจะยังคงทำงานได้ถ้าอันดับแรก/อยู่ในตำแหน่งที่แตกต่างกัน

ข้อดีอีกอย่างของโครงสร้างนี้ก็คือมันจะสามารถขยายไปยังองค์ประกอบมากกว่าหนึ่งตัวอย่างเช่นกับทุกคนที่ใช้คลาสเพียงแค่เปลี่ยนตัวเลือก

การสาธิต (โปรดทราบว่าฉันต้องเลือก jQuery ในเมนูทางด้านซ้ายของหน้าต่าง jsfiddle)

คุณควรใช้ html ():

ดูตัวอย่าง

$(document).ready(function(){
    $("#date").html('<span>'+$("#date").text().substring(0, 2) + '</span><br />'+$("#date").text().substring(3));     
});

ลอง

date.innerHTML= date.innerHTML.replace(/^(..)\//,'<span>$1</span></br>')

<div id="date">23/05/2013</div>

ใช้สิ่งนี้

<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>

ลองสิ่งนี้

$("div#date").text().trim().replace(/\W/g,'/');

การสาธิต

ดูการแสดงออกปกติ http://regexone.com/lesson/misc_meta_characters

สนุกกับเรา ;-)

var str = "How are you doing today?";

var res = str.split(" ");

นี่คือตัวแปร "res" เป็นชนิดของอาร์เรย์

คุณยังสามารถอธิบายได้ด้วยการประกาศว่าเป็น

var res[]= str.split(" ");

ตอนนี้คุณสามารถเข้าถึงแต่ละคำของอาเรย์ สมมติว่าคุณต้องการเข้าถึงองค์ประกอบที่สามของอาเรย์ที่คุณสามารถใช้ได้โดยการทำดัชนีองค์ประกอบอาเรย์

var FirstElement= res[0];

ตอนนี้ตัวแปร FirstElement มีค่า 'อย่างไร'