[javascript] 첫 번째`/`(슬래시)에서 문자열을 분리하고`<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>')
});

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

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

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

답변

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에는 ‘How’값이 포함됩니다.