웹 개발시 도움이 되는 꿀팁🍯

디자인 모드(Design Mode) 적용

웹 브라우저에서 임시로 화면을 수정하는 기능으로 개발자도구 콘솔창에 document.designMode="on" 을 입력하면 된다

디자인 모드를 끄고 싶다면 반대로 document.designMode="off" 를 입력하면 된다

 

 

 

---

 

 

 

브라우저 콘솔 활용

1. debugger

개발자 도구에서 원하는 객체의 값을 출력하는 용도로 쓰이는 console.log()
확인해야할 객체가 여러 개인 경우 console.log()를 하나하나 일일히 찍어야 하지만 debugger라는 명령어를 입력하면 간편하게 디버깅 작업을 할 수 있다

 

 

2. console.table() / console.dir()

console.log()를 사용하는 일이 생길 때에는 console.tabel() 또는 console.dir()를 사용하면 좀 더 시각적으로 편하게 디버깅 작업을 할 수 있다

 

 

3. c()

console.log()를 자주 사용한다면 c()로 짧게 줄여 사용하는 방법도 있다

 

 

 

---

👀 참고

https://yozm.wishket.com/magazine/detail/1585/