첫 번째`/`(슬래시)에서 문자열을 분리하고`<span>`에서 문자열의 일부를 둘러싸는 방법은 무엇입니까?


167

이 날짜의 형식을 지정하고 싶습니다 <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를 도와 줄 수 있습니까?


1
로 참조하지 귀하의 바이올린 jQuery여기가 업데이트됩니다 jsfiddle.net/K3D6d/2
Dhaval Marthak

답변:


374

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

4
다음과 같이 스크립트를 줄일 수도 있습니다.var arr = $('#date').text().split('/');
SearchForKnowledge

고마워, 아딜 당신의 대답은 하나를 포기할 가치가 있습니다. 감사.
ankit suthar

10

고정 인덱스로 하위 문자열을 사용하는 대신 다음을 사용하는 것이 좋습니다 replace.

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

한 가지 장점은 첫 번째 /위치가 다른 경우에도 여전히 작동한다는 것입니다 .

이 구조의 또 다른 장점은 선택기를 변경하여 클래스를 구현하는 모든 요소에 대해 둘 이상의 요소로 확장 할 수 있다는 것입니다.

데모 (jsfiddle 창 왼쪽의 메뉴에서 jQuery를 선택해야 함)


2

html ()을 사용해야합니다.

데모보기

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


0

이것을 사용하십시오

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

이 작동하지 않습니다. 당신이 호출 .textx? 확실합니까 ?
Mohammad Adil 2016 년


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

var res = str.split(" ");

여기서 변수 "res"는 일종의 배열입니다.

이 선언을 다음과 같이 선언하여 취할 수도 있습니다.

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

이제 배열의 개별 단어에 액세스 할 수 있습니다. 배열 요소를 인덱싱하여 사용할 수있는 배열의 세 번째 요소에 액세스한다고 가정합니다.

var FirstElement= res[0];

변수 FirstElement에는 'How'값이 포함됩니다.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.