104. (jquery/제이쿼리) [간단 소스] textarea 에 설정 된 현재 폰트 사이즈 확인 및 css 폰트 스타일 변경 수행

---

[개발 환경 설정]

​

개발 툴 : Edit++ / Vscode

​

개발 언어 : jquery

​

 

---

[소스 코드]

​

// --------------------------------------------------------------------------------------
[개발 및 테스트 환경]
// --------------------------------------------------------------------------------------

- 언 어 : JQuery


- 개발 툴 : Edit ++ / Vscode


- 구 분 : HTTP / WEB


- 사전) 👉 👉 textarea 간략 설명 : 

  >> HTML 의 <textarea> 컴포넌트는 사용자가 여러 줄의 텍스트를 입력할 수 있도록 해주는 폼 요소입니다.

  >> HTML 의 <textarea> 컴포넌트는 메모장 같은 입력 영역이 필요한 곳에서 사용됩니다.

  >> 기본 형태 : <textarea></textarea>

  >> 주요 속성 : 

    - rows / cols : 표시되는 줄 수 / 너비(문자 수)를 설정
    - placeholder : 입력 전 안내 문구 표시
    - maxlength : 최대 입력 글자 수 제한
    - readonly : 읽기 전용 (입력 불가, 복사는 가능)
    - disabled : 비활성화 (입력도 안 되고, form 제출에도 포함되지 않음)
    - name : form 데이터를 서버로 보낼 때 key 역할
    - wrap : 자동 줄바꿈 방식을 제어

// --------------------------------------------------------------------------------------






// --------------------------------------------------------------------------------------
[소스 코드]
// --------------------------------------------------------------------------------------

-------------------------------------------
[JQuery : CDN 주소 설정 방법]
-------------------------------------------
<script src="https://code.jquery.com/jquery-latest.min.js"></script>


-------------------------------------------
[Body : HTML Body 에 textarea 생성 방법]
-------------------------------------------
<textarea id="memo" rows="5" cols="40" style="font-size: 16px;"></textarea>


-------------------------------------------
[Script : 스크립트에서 현재 폰트 사이즈 확인 방법]
-------------------------------------------

// [jQuery]
const fs = $('#memo').css('font-size');  // 예: "16px" (대개 px로 반환됨)
console.log(fs);

// [숫자만 필요한 경우]
const fsNum = parseFloat(fs); // 16


-------------------------------------------
[Script : 스크립트에서 폰트 사이즈 변경 (Set) 방법]
-------------------------------------------

// [고정 크기로 설정 방법]
$('#memo').css('font-size', '18px');

// [여러 속성을 한 번에 지정 방법] : 단위는 px, em, rem 등 원하는 단위를 사용할 수 있습니다.
$('#memo').css({
  'font-size': '18px',
  'line-height': '1.5'
});

// --------------------------------------------------------------------------------------






// --------------------------------------------------------------------------------------
[참고 사이트]
// --------------------------------------------------------------------------------------

[간단 소스] 자바스크립트 textarea 에 설정 된 fontSize 폰트 사이즈 확인 및 동적 style 스타일 지정 폰트 사이즈 변경

https://kkh0977.tistory.com/8686

https://blog.naver.com/kkh0977/224211663484


[간단 소스] 자바스크립트 Object.keys 사용해 json 에 저장 된 key 키 포함 및 개수 확인 및 for 문 key , value 출력

https://kkh0977.tistory.com/8691

https://blog.naver.com/kkh0977/224214219987


[자바스크립트 json string 문자열 데이터 JSON.parse 사용해 model 객체에 매핑 수행]

https://kkh0977.tistory.com/5055

https://blog.naver.com/kkh0977/223304887680?trackingCode=blog_bloghome_searchlist


[JsonArray 에 담긴 JsonObject 객체 파싱해 특정 idx (순서) 로 정렬 실시]

https://kkh0977.tistory.com/876

https://blog.naver.com/kkh0977/222399966146?trackingCode=blog_bloghome_searchlist

// --------------------------------------------------------------------------------------

 

---

[참고 사이트]

​

https://kkh0977.tistory.com/8686

506. (javaScript) [간단 소스] 자바스크립트 textarea 에 설정 된 fontSize 폰트 사이즈 확인 및 동적 style

---