연말까지 매일 웹사이트를 꾸준히 만드는 대학생~ 3일째 문자수 카운터 만들기~

개시하다

처음 뵙겠습니다.
저는 연말까지 매일 웹 사이트를 만드는 사람입니다.
오늘 자수 계수기를 만들었다.
사용하는 기술 수준은 낮지만 같은 고민을 하는 초보자에게 용기를 주면 좋겠다.
오늘은 셋째 날이다.(2019/10/21)
잘 부탁드립니다.

사이트 축소판 그림

해본 일

텍스트를 복사하여 문자 수를 계산할 수 있는 시스템을 만들었습니다.
사용하는 언어는 JavaScript입니다.
어제 한 문자열 조작공백/줄 바꿈 시스템이 재미있어서 오늘도 문자열로 묶어 봤어요.이런느낌↓

구애되는 곳

단어 수에 공백과 줄 바꾸기를 넣을지 여부를 선택할 수 있습니다.
공백과 줄 바꿈의 문자 수를 알고 싶으면 "공백 있음"단추를 누르십시오
공백과 줄 바꾸기가 필요하지 않고 글자 수만 알고 싶으면 '공백 없음' 단추를 누르십시오.
} 부분은 입력 표시줄form+textarea이고 출력 부분은button+div로 제작되었습니다.
JavaScript도 어제 한 거 살짝 정리했을 뿐↓

 <script>
        function text() {
            var text = document.forms.form1.input_text.value;
            var text11 = text.length;
            var target = document.getElementById("output");
            target.innerText = text11;
        }

        function text2() {
            var text2 = document.forms.form1.input_text.value;
            var text22 = text2.replace(/\s+/g, "");
            var target2 = document.getElementById("output2");
            target2.innerText = text22.length;
        }
    </script>

공백이 있고 줄을 바꾼 사람은 입력 정보를 받아서length 방법으로 길이를 측정한다.
공백과 줄을 바꾸지 않은 사람은 입력 정보를 받고 공백과 줄을 바꾼 후length 방법으로 길이를 측정한다.

감상

나는 문자열 조작에 빠졌다.
다음은 하이라이터를 만들고 더 놀라운 것을 만들고 싶어요.
나는 글자 수를 계산하는 것이 더 어렵다고 생각하지만, 실제로는 매우 간단하다.
이것도 만드는 법 덕분이지.
그리고 원본 트리를 사용하는git 작업은 여전히 순조롭지 않습니다.바로 올릴 수 있어서 사이트에서 볼 수 있는데 조금 흐릿해요...

참고 자료

String - JavaScript | MDN
↑ MDN의 기본을 잘 알기 때문에 추천합니다.
끝까지 읽어주셔서 감사합니다.