자바스크립트 replace all

 

 

자바스크립트 함수에는 특정문자를 바꾸는 기능을 하는 replace라는 함수가 있습니다.

그러나 이 함수는 특정문자에 대하여 단 한번만 변경하게 됩니다.

그렇다면 특정문자를 모두 변경 하고자 할 때 어떻게 하면 되는지 알아 보도록 하겠습니다.

예를 들어 콤마를 모두 제거하고 싶거나 특정문자를 다른 문자로 모두 변경하고자 할 때 입니다.

 

■ 한번만 변경하게 되는 기본 사용방법

문자열.replace("변경 할 문자", "변경 될 문자");

 

예제> "aaaa".replace("aa", "bb");

결과> "aabb" 

 

특정문자 모두 바꾸기

문자열.replace(/변경 할 문자/g, "변경 될 문자");

 

예제> "aaaa".replace(/aa/g, "bb");

결과> "bbbb" 

 

숫자만 남기기(콤마제거 및 모든 문자 제거)

aaaa".replace(/[^\d]+/g, "");

 

예제> "12,343,132".replace(/[^\d]+/g, "");

결과> "12343132" 

 

 

최종예제

- 아래 예제는 변수를 활용한 replace 예제 입니다. 또한 gi에서 g는 all 그리고 i 는 대소문자 구분을 없애는 옵션이 됩니다.

 

▶ 변경 전(문자열 입력) : <input type="text" id="str1" style="width:200px;">
- 변경 할 문자 : <input type="text" id="str2" style="width:50px;">
- 변경 될 문자 : <input type="text" id="str3" style="width:50px;">
<input type="button" value="적용" onClick="apply()">
▶ 변경 후 : <input type="text" id="str4" style="width:200px;">

 

최종예제 결과

자바스크립트 replace 실습 결과

 

최종예제 실습

- 정보를 입력하여 적용 버튼을 클릭 해 보면 문자가 변경 된 결과 값을 확인 할 수 있습니다.

▶ 변경 전(문자열 입력) :
    - 변경 할 문자 :   - 변경 될 문자 :  
▶ 변경 후 :

 

Posted by JOY [바가지]

댓글을 달아 주세요

  1. Deborah 2018.09.28 02:03 신고  댓글주소  수정/삭제  댓글쓰기

    유익한 공부를 할 수가 있는 그런 포스팅이라 참 좋네요. 오늘도 수고 많으셨어요.

  2. *저녁노을* 2018.09.28 05:50 신고  댓글주소  수정/삭제  댓글쓰기

    잘 보고갑니다.

    즐거운 금요일 되세요^^

  3. kangdante 2018.09.28 08:48 신고  댓글주소  수정/삭제  댓글쓰기

    어려워 보이지만
    잘 보고 갑니다
    편안하고 여유로운 하루되세요.. ^.^

  4. 발랄제시카 2018.09.30 07:56 신고  댓글주소  수정/삭제  댓글쓰기

    오~ 요거 정말 유용할 것 같아요.

  5. 멜로요우 2018.10.01 14:09 신고  댓글주소  수정/삭제  댓글쓰기

    자바스크립트 배워보려고하지만 너무 외울게 많아서 책한장 펴보고 포기 했어요..ㅠ



티스토리 툴바