Comment découper une chaîne de caractères au premier `/` (slash) et surround partie dans une " <span>`?

Je veux formater cette date: <div id="date">23/05/2013</div>.

D'abord je tiens à diviser la corde à la première / et le reste dans la ligne suivante. Ensuite, je voudrais d'entourer la première partie dans un <span> balise, comme suit:

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

Ce que j'ai fait:

HTML:

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

Voir le JSFiddle.

Mais cela ne fonctionne pas. Quelqu'un peut m'aider avec jQuery?

InformationsquelleAutor Mustapha Aoussar | 2013-05-23
  1. 367

    À l'aide de split()

    Extrait de :

    JS:

    var data =$('#date').text();
var arr = data.split('/');
$("#date").html("<span>"+arr[0] + "</span></br>" + arr[1]+"/"+arr[2]);

    HTML:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="date">23/05/2013</div>

    Violon

    Lorsque vous divisez cette chaîne ---> 23/05/2013 sur /

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

    vous aurez un tableau de taille 3

    arr[0] --> 23
arr[1] --> 05
arr[2] --> 2013
    • Vous pouvez également raccourcir le script comme ceci: var arr = $('#date').text().split('/');
    • Merci, Adil. Votre réponse est vaut la peine de donner un. Merci.
    InformationsquelleAutor Mohammad Adil
  2. 10

    Au lieu d'utiliser des sous-chaîne avec un indice fixe, vous feriez mieux d'utiliser replace :

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

    Un avantage est qu'il fonctionne encore si la première / est à une position différente.

    Un autre avantage de cette construction est qu'il serait extensible à plus d'un des éléments, par exemple à tous ceux qui l'implémentation d'une classe, juste en changeant le sélecteur.

    Démonstration (à noter que j'ai eu pour sélectionner jQuery dans le menu dans la partie gauche de jsfiddle de la fenêtre)

    InformationsquelleAutor Denys Séguret
  3. 2

    Vous devez utiliser le format html():

    VOIR LA DÉMO

    $(document).ready(function(){
    $("#date").html('<span>'+$("#date").text().substring(0, 2) + '</span><br />'+$("#date").text().substring(3));     
});
    • Merci beaucoup!
    InformationsquelleAutor A. Wolff
  4. 1

    essayer

    JS:

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

    HTML:

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

    InformationsquelleAutor Kamil Kiełczewski
  5. 0

    utiliser cette

    <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>
    • cela ne fonctionne pas. vous appelez .text sur x ? êtes-vous sûr ?
    InformationsquelleAutor Anand Shah
  6. 0

    Essayer cette

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

    DÉMO

    Rechercher une expression régulière
    http://regexone.com/lesson/misc_meta_characters

    profiter de nous 😉

    InformationsquelleAutor KingRider
  7. -2
    var str = "How are you doing today?";

var res = str.split(" ");

    Ici la variable "res" est une sorte de tableau.

    Vous pouvez également profiter de cette explicitement en déclarant comme

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

    Vous pouvez maintenant accéder à l'individu de mots du tableau.
    Supposons que vous souhaitez accéder à la troisième élément du tableau, vous pouvez les utiliser par l'indexation des éléments du tableau.

    var FirstElement= res[0];

    Maintenant la variable FirstElement contient la valeur 'Comment'

    • var res[]= str.split(" "); n'a pas fonctionné!
    InformationsquelleAutor Mike Clark