카테고리: JavaScript

브라우저 주소 막대에서 긴 주소 리본을 꺼내 여러 구성 조각으로 나누는 모습

JavaScript / document.URL로 현재 주소 가져오기와 URL 분석

document.URL로 현재 문서의 전체 주소를 읽고 URL 객체로 경로·쿼리·해시를 분리합니다. 읽기 전용 속성과 location을 통한 이동의 차이를 설명합니다.

문서 카드의 문자 데이터 리본이 일정한 패턴의 인코딩 블록으로 정렬되는 모습

JavaScript / document.characterSet으로 문자 인코딩 확인하기

document.characterSet으로 브라우저가 현재 HTML 문서를 해석한 인코딩을 확인합니다. meta charset 선언과 실제 적용값의 차이 및 문자 깨짐 점검 방법을 설명합니다.

큰 디스플레이 프레임 안에 더 작은 브라우저 콘텐츠 프레임이 겹쳐진 모습

JavaScript / screen으로 화면 크기 구하기와 뷰포트 차이

JavaScript Screen 객체의 화면 크기·사용 가능 영역·색 깊이 속성을 설명합니다. screen.width와 브라우저 뷰포트의 innerWidth를 직접 비교합니다.

부모 프레임 바로 아래의 자식 블록들과 더 깊은 중첩 블록이 구분되는 모습

JavaScript / childElementCount로 자식 요소 개수 구하기

Element.childElementCount가 텍스트 노드를 제외한 직접 자식 요소만 세는 방법을 설명합니다. children.length·childNodes와 비교하고 목록 추가·삭제로 확인합니다.

웹 요소 카드에서 작은 속성 태그를 떼어 내는 모습

JavaScript / removeAttribute()로 HTML 속성 제거하기

Element.removeAttribute()로 HTML 속성을 제거하고 hasAttribute()로 확인하는 방법을 설명합니다. disabled 속성의 제거와 복원을 실행 가능한 예제로 보여 줍니다.

기존 문서 패널이 새 문서 스트림으로 교체되는 과정이 표현된 모습

JavaScript / document.write() 사용법과 문서가 지워지는 이유

document.write()가 HTML 파싱 중에 문서 스트림에 쓰는 방식과 로드 후 호출 시 위험을 설명합니다. 사용자 입력은 DOM과 textContent로 안전하게 표시합니다.

문서 스트림에 줄 단위 리본이 추가되고 별도 DOM 패널과 비교되는 모습

JavaScript / document.writeln()의 줄바꿈 동작과 대체 방법

document.writeln()이 줄바꿈을 추가하는 방식과 HTML에서 실제로 보이는 결과를 설명합니다. 기존 코드의 위험과 textContent를 쓰는 대체 예제를 확인합니다.

브라우저 창의 상단 탭 영역에 새로운 빈 제목 카드가 끼워지는 모습

JavaScript / document.title로 브라우저 탭 제목 변경하기

document.title로 현재 페이지의 제목을 읽고 브라우저 탭 제목을 바꾸는 방법을 설명합니다. title 요소와의 관계 및 원래 제목 복원을 예제로 확인합니다.

하나의 문자열 리본 조각이 같은 간격으로 반복되어 길게 이어지는 모습

JavaScript / repeat()로 문자열 반복하기와 횟수 제한

String.repeat()로 문자열을 지정한 횟수만큼 연결하는 방법을 설명합니다. 0회 결과, 소수·음수 처리와 사용자 입력 검증을 예제로 확인합니다.

작은 코드 단위 블록들이 합쳐져 하나의 부드러운 문자 형태 조각으로 바뀌는 모습

JavaScript / fromCharCode()로 UTF-16 코드 값을 문자로 변환하기

String.fromCharCode()로 UTF-16 코드 단위 숫자에서 문자열을 만드는 방법을 설명합니다. charCodeAt()과의 방향 차이 및 fromCodePoint()가 필요한 경우를 확인합니다.