[카테고리:] JavaScript

자바스크립트로 웹 앱을 개발할 때 디버깅 방법 중 콘솔에 필요한 로그를 출력하는 것은 매우 유용합니다. 이런 유용함에 더해 원하는 로그에 대한 문자열의 색상 등과 같은 스타일을 지정할 수도 있는데요. 아래의 코드가 바로 그 예시입니다.

console.log(
    '%cHello %cWorld. %cMy Name is %cDip2K.', 
    'color: red', 
    'color: yellow',
    'color: gray',
    'color: white;font-weight: 900'
)

출력 결과는 다음과 같습니다.

먼저 웹 페이지에서 전체 내용을 다 보기 위해 스크롤 해야할 크기는 다음 코드로 얻을 수 있습니다.

let totalHeight = document.body.scrollHeight - window.innerHeight;

다음으로 지금 스크롤된 정도를 백분율 값으로 얻는 코드는 다음과 같습니다.

let scrollPercentage = (window.pageYOffset / totalHeight) * 100;