자바스크립트 함수에는 특정문자를 바꾸는 기능을 하는 replace라는 함수가 있습니다.
그러나 이 함수는 특정문자에 대하여 단 한번만 변경하게 됩니다.
그렇다면 특정문자를 모두 변경 하고자 할 때 어떻게 하면 되는지 알아 보도록 하겠습니다.
예를 들어 콤마를 모두 제거하고 싶거나 특정문자를 다른 문자로 모두 변경하고자 할 때 입니다.
■ 한번만 변경하게 되는 기본 사용방법
결과> "aabb"
■ 특정문자 모두 바꾸기
결과> "bbbb"
■ 숫자만 남기기(콤마제거 및 모든 문자 제거)
예제> "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;">
■ 최종예제 결과
■ 최종예제 실습
- 정보를 입력하여 적용 버튼을 클릭 해 보면 문자가 변경 된 결과 값을 확인 할 수 있습니다.
- 변경 할 문자 : - 변경 될 문자 :
▶ 변경 후 :
'프로그래밍 > HTML, CSS, JavaScript' 카테고리의 다른 글
[JavaScript] 원하는 부분 프린터 하기-print() (2) | 2019.02.01 |
---|---|
HTML/CSS 이미지효과 - 마우스 오버시에 텍스트 보이기 예제소스 (6) | 2018.08.01 |
체크박스 클릭 시 해당 테이블 줄 배경색 변경하기 (6) | 2018.07.25 |
[HTML/CSS] DIV 중앙, 가운데 배치하기 (6) | 2018.07.01 |
[JavaScript] 펼쳐지는 세로 트리메뉴 쉽게 만들기 (3) | 2018.06.25 |