Come dividere una stringa nel primo `/` (barra) e circondarne una parte in un `<span>`?

Voglio formattare questa data: <div id="date">23/05/2013</div>.

Per prima cosa voglio dividere la stringa all'inizio /e avere il resto nella riga successiva. Successivamente, vorrei racchiudere la prima parte in un <span>tag, come segue:

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

23
05/2013

Cosa ho fatto:

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

Vedi il JSFiddle .

Ma questo non funziona. Qualcuno può aiutarmi con jQuery?

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

Violino

Quando si divide questa stringa ---> 23/05/2013su/

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

otterrai una matrice di dimensioni 3

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

Invece di usare la sottostringa con un indice fisso, è meglio usare replace:

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

Un vantaggio è che funzionerebbe ancora se il primo si /trova in una posizione diversa.

Un altro vantaggio di questo costrutto è che sarebbe estendibile a più di un elemento, ad esempio a tutti quelli che implementano una classe, semplicemente cambiando il selettore.

Dimostrazione (nota che ho dovuto selezionare jQuery nel menu nella parte sinistra della finestra di jsfiddle)

Dovresti usare html ():

VEDI DEMO

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

provare

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

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

Usa questo

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

Prova questo

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

DEMO

Guarda un'espressione regolare http://regexone.com/lesson/misc_meta_characters

divertiti ;-)

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

var res = str.split(" ");

Qui la variabile "res" è una specie di array.

Puoi anche prendere questa esplicita dichiarandola come

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

Ora puoi accedere alle singole parole dell'array. Supponiamo di voler accedere al terzo elemento dell'array per poterlo indicizzare gli elementi dell'array.

var FirstElement= res[0];

Ora la variabile FirstElement contiene il valore 'How'