DevTools có nhiều cách để mở và cũng chẳng có gì phức tạp, mỗi cách sẽ thích hợp cho sở thích và mục đích khác nhau của từng người.
Cách 1: chuột phải vào trang web và chọn “Inspect”.
Cách 2: sử dụng các tổ hợp phím tắt.
Mục đích | Windows, Linux | Mac |
Mở lại panel mà lần cuối bạn sử dụng | F12 or Control+Shift+I | F12 or Fn+F12 or Option+Command+I |
Mở Console panel để xem logs hoặc chạy Javascript | Control+Shift+J | Option+Command+J |
Mở Elements panel để xem DOM và CSS | Control+Shift+C | Option+Command+C or Command+Shift+C |
Cách 3: mở từ menu chính của Chrome > More Tools > Developer Tools
Cách 4: tự động bật DevTools mỗi khi mở tab mới
Cách này chỉ hoạt động khi không có tab Chrome nào được mở trước đó.
Windows: thêm --auto-open-devtools-for-tabs
vào Chrome shortcut.
Mac: mở Terminal và chạy command/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --auto-open-devtools-for-tabs
Nguồn tham khảo:
https://developer.chrome.com/docs/devtools/open
https://developer.chrome.com/docs/devtools/shortcuts