[오답노트] JavaScript , JQuery 한글자씩 접근 / 글자 나누기 대문자 소문자 글자색 변경하기

SQL 관련 글을 쓰다보니 쿼리문은 대문자 그 외는 소문자로 작성하는데

티스토리에서 아이콘을 클릭해가며 글자색 변경 하는거에 현타를 느껴,

Q. 자동으로 대소문자를 구별해서 색상을 변환 해주는걸 구현해보기로 생각해서 만들어 봤다.

function translation_comment(){
    let rows = $('#translation').val();
    for (i = 0;i < rows.length; i++){
        let a = rows.charAt(i); //charAt()함수로 글자 하나씩 접근한다.
        if (a == a.toUpperCase()){ //받아온 변수 a가 대문자인지 판별한다.
            let temp = `<span style="color: rgb(238,35,35)">${a}</span>` 
                $('#translationreturn').append(temp) //검토완료된 대문자를 span태그로 작성해준다.

        }else{
            let temp = `<span style="color: rgb(0,109,215)">${a}</span>`
                $('#translationreturn').append(temp)
      }
    }
}

A . 우선 글자를 하나씩 나눠야 됏다 

글자를 translation 이라는 곳에서 문자열을 받아온 후 

받아온 문자열을 하나하나 나눠야 됏다.

for문으로 글자숫자만큼 돌려준 후 charAt() 함수로 글자하나에 접근했다.

(배열처리로 해도 된다고 하는데.. 뭔가 더 어려워 질 것 같아서.. 빠른 과제를 하기 위함이었지 나를 테스트하기 위함은 아니었다...)

그리고 if 문으로 받아온 변수a 의 값이 대문자 인지 아니면 소문자 인지를 판별하는 조건문을 추가하였다.

그리고 각 받아온 한글자 한글자를 span태그로 붙여주면 끝~

(.append 뒤에 css.color 을 추가하려고 했지만 이러면 글자 전체의 색이 변경 되었다...나중에 스킬이 조금 더 늘면 while문의로 한문단 한문단씩 만드는 코드로 바꿔봐야겠다.)

이제 검정글씨로 다 작성하고 복붙만 하면 된다 ;; 나이스....