[JavaScript] 자바스크립트에서 타이틀 변경하기

103_자바스크립트에서 타이틀 변경하기

[적용]

• 타이틀을 동적으로 변환하고 싶을 때
• 읽지 않은 메시지 건수를 타이틀 바에 표시하고 싶을 때

---

[문법]

속성	의미	타입
document.title	페이지 타이틀	문자열

---

[내용]

document.title 속성으로 페이지의 타이틀 정보를 가져올 수 있으며,

읽기와 쓰기가 모두 가능하다.

 

// 읽기 작업
const title = document.title;

// 쓰기 작업
document.title = '타이틀 내용';

document.querySelector('#btnApple').addEventListner('click', () => {
	document.title = '사과';
});

document.querySelector(#btnOrange').addEventListner('click', () => {
	document.title = '오렌지';
});

 

페이지의 타이틀은 속성에 문자열을 대입하면 변경이 가능하며, 동적으로 변경하고 싶을 때 효과적이다.

예를 들어, 채팅 앱에서 읽지 않은 메시지의 수를 타이틀에 표시할 때 유용하다.

 

---

 

 

 

 

 

참조 :
실무에 바로 적용하는 자바스크립트 코드레시피 278
아케다 야스노부, 카노 타케시 지음 / 이춘혁 옮김