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”.

chuột phải và chọn Inspect để mở DevTools

Cách 2: sử dụng các tổ hợp phím tắt.

Mục đíchWindows, LinuxMac
Mở lại panel mà lần cuối bạn sử dụngF12 or
Control+Shift+I
F12 or
Fn+F12 or
Option+Command+I
Mở Console panel để xem logs hoặc chạy JavascriptControl+Shift+JOption+Command+J
Mở Elements panel để xem DOM và CSSControl+Shift+COption+Command+C or
Command+Shift+C

Cách 3: mở từ menu chính của Chrome > More Tools > Developer Tools

mở Chrome DevTools

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.

auto open chrome devtools on windows

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

Để lại một bình luận

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *