jquery 천단위 숫자 적용하기.
2023. 4. 7. 10:29ㆍ코딩
반응형
<!-- 표시할 숫자가 있는 요소 -->
<div id="myNumber">1234567</div>
// 천단위 숫자 포맷 적용 함수
function numberWithCommas(x) {
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
// 숫자 요소를 선택하고 포맷을 적용
var myNumber = $("#myNumber").text();
$("#myNumber").text(numberWithCommas(myNumber));
먼저, 숫자를 천단위로 구분하여 포맷을 적용하는 numberWithCommas() 함수를 작성합니다. 이 함수는 문자열로 변환된 숫자에 정규 표현식을 적용하여 숫자를 천단위로 구분하고, 각 구분자 사이에 쉼표를 추가합니다.
이후에는 jQuery의 $() 함수를 사용하여 숫자 요소를 선택하고, .text() 메서드를 사용하여 해당 요소의 텍스트 값을 가져옵니다. 가져온 텍스트 값을 numberWithCommas() 함수에 인자로 전달하여 포맷을 적용하고, .text() 메서드를 다시 사용하여 포맷이 적용된 텍스트 값을 숫자 요소에 설정합니다.
위 코드에서는 $("#myNumber") 선택자를 사용하여 id 속성이 myNumber인 요소를 선택하였습니다. 다른 요소를 선택하려면 적절한 선택자를 사용하면 됩니다.
'코딩' 카테고리의 다른 글
jQuery에서 data 메소드를 사용하여 요소에 저장된 데이터 객체 (2) | 2023.04.07 |
---|---|
PHP를 사용하여 웹 페이지를 크롤링하는 예제 소스 코드입니다. (1) | 2023.04.07 |
jquery div append 소스 (1) | 2023.04.07 |
jQuery를 사용하여 로딩 화면을 표시하고, AJAX 요청을 보내고 응답을 받는 동안 로딩 화면을 유지하는 코드 예시입니다. (3) | 2023.04.07 |
jQuery를 사용하여 AJAX 요청 및 JSON 응답 데이터 처리하는 코드 예시입니다. (3) | 2023.04.07 |