Lý do phổ biến nhất khiến người dùng muốn mở console trình duyệt là để xác định vấn đề với chỉnh sửa trang, các yếu tố giao diện bị hỏng, các khối hành vi bất thường và các loại lỗi và xung đột JavaScript khác. Tuy nhiên, mỗi trình duyệt đều có phím tắt và bước riêng sẽ cuối cùng cho phép bạn mở console và xem back-end của trang web bạn truy cập.
Vì chỉ có bốn trình duyệt khác nhau có trên 5% thị phần (Chrome, Safari, Edge và Firefox), chúng tôi sẽ chỉ cho bạn nhiều cách mở console trên từng trình duyệt. Nhưng hãy nhớ rằng với mỗi trình duyệt, các yếu tố & lỗi thường được mã hóa màu và gán nhãn khác nhau.
Cách mở Console trên Google Chrome
Trên Chrome, thực sự có ba cách khác nhau sẽ cho phép bạn mở console tích hợp sẵn.
Bất kể bản dựng Chrome bạn đang sử dụng, bạn có thể sử dụng một trong các phím tắt sau để mở và đóng console tích hợp sẵn:
- F12
- Ctrl + Shift + J (Cmd + Option + J trên Mac)
Hãy nhớ rằng các phím tắt giống nhau cũng có thể được dùng để ẩn console. Mặc định, console của Google Chrome chiếm đúng một nửa màn hình, nhưng bạn có thể dễ dàng điều chỉnh tỷ lệ qua thanh trượt ở giữa và trình duyệt sẽ ghi nhớ thay đổi lần sau bạn mở console.
Nếu bạn muốn tập trung vào một yếu tố cụ thể, bạn có thể đơn giản highlight (tô亮) nó bằng chuột sau đó chuột phải vào nó > Kiểm tra (Inspect). Điều này sẽ mở tab Elements (Yếu tố) và tab Styles (Kiểu) của console, cho phép bạn tập trung vào yếu tố đang xử lý.
Tuy nhiên, bạn cũng có thể truy cập console qua menu GUI của Google Chrome. Để làm điều này, chỉ cần nhấp vào nút hành động ở góc trên bên phải và đi đến Công cụ khác > Công cụ nhà phát triển (More Tools > Developer Tools).
Nếu bạn đang tìm cách làm việc hiệu quả nhất có thể, đây là danh sách các phím tắt Chrome Console bạn có thể sử dụng.
Cách mở Console trên Google Microsoft Edge
Giống như mọi trình duyệt khác, Microsoft Edge cũng có công cụ Console dành cho các nhà phát triển thực hiện gỡ lỗi tương tác (interactive debugging) hoặc kiểm tra ad hoc.
Công cụ này ghi nhật ký thông tin liên quan đến trang web đang được truy cập. Bạn sẽ tìm thấy thông tin liên quan đến Javascript, yêu cầu mạng và lỗi bảo mật.
Cách dễ dàng mở Công cụ Console trên Microsoft Edge là sử dụng phím tắt định sẵn (Phím F12).
Nhưng bạn cũng có thể làm theo menu GUI bằng cách nhấp vào nút hành động (góc trên bên trái) > Công cụ khác > Công cụ nhà phát triển (More tools > Developer Tools).
Và tương tự như chức năng trên các trình duyệt khác, Microsoft Edge cũng cho phép bạn kiểm tra các yếu tố cụ thể bằng console tích hợp sẵn. Để làm điều này, chỉ cần chọn và chuột phải vào một yếu tố và chọn Kiểm tra yếu tố (Inspect Element).
Dưới đây là danh sách một số phím tắt hữu ích bạn có thể sử dụng bên trong console tích hợp sẵn của Microsoft Edge:
| Khởi chạy Console ở chế độ tập trung | Ctrl + Shift + J |
| Chuyển sang Console | Ctrl + 2 |
| Hiện hoặc ẩn Console từ tab DevTools khác | Ctrl + ` (back tick) |
| Thực thi (lệnh một dòng) | Enter |
| Ngắt dòng mà không thực thi (lệnh nhiều dòng) | Shift + Enter hoặc Ctrl + Enter |
| Xóa Console tất cả thông báo | Ctrl + L |
| Lọc nhật ký (đặt tiêu điểm vào hộp tìm kiếm) | Ctrl + F |
| Chấp nhận gợi ý tự động hoàn thành (khi đang tập trung) | Enter hoặc Tab |
| Gợi ý tự động hoàn thành trước đó/tiếp theo | Phím mũi tên lên/Phím mũi tên xuống |
Cách mở Console trên Mozilla Firefox
Console tích hợp sẵn trên Mozilla Firefox hoạt động hơi khác so với các trình duyệt tương đương chúng tôi đã phân tích cho đến nay. Cụ thể, nó sẽ tự động mở trong một cửa sổ độc lập (standalone window), thay vì chia màn hình trình duyệt của bạn thành hai nửa.
Điều này cho phép cách tiếp cận hiệu quả hơn cho người dùng có màn hình thứ hai nhưng có thể cản trở những người dùng cần làm việc với một màn hình nhỏ. (Nếu bạn đang ở kịch bản này, bạn có thể dùng phím tắt Alt + Tab để chuyển qua lại giữa Firefox và Console trình duyệt liên quan.
Để mở console trình duyệt tích hợp sẵn trên Mozilla Firefox, bạn có ba lựa chọn:
- Bạn có thể dùng phím tắt phổ dụng – Ctrl + Shift + J (hoặc Cmd + Shift + J trên Mac)
- Bạn có thể mở nó từ menu hành động – Bằng cách nhấp vào menu hành động > Nhà phát triển Web > Console trình duyệt (Web Developer > Browser Console).
- Hoặc bạn có thể buộc Console trình duyệt mở trực tiếp bằng cách khởi chạy Firefox từ dòng lệnh và truyền đối số '-jsconsole':
/Applications/FirefoxAurora.app/Contents/MacOS/firefox-bin -jsconsole
Lưu ý: Firefox cũng bao gồm Web console, rất giống với Browser console nhưng nó được áp dụng trên một tab nội dung đơn lẻ thay vì trên toàn bộ trình duyệt.
Cách mở Console trên Google Safari
Khác với mọi trình duyệt chúng tôi đã xem cho đến nay, Error Console trên Safari bị tắt theo mặc định. Vì vậy, bạn sẽ cần làm một bước thêm để bật nó trên trình duyệt của bạn.
Để làm điều này, mở Safari và nhấp vào tab Tùy chọn (Preferences). Một khi bạn đã ở trong tab Tùy chọn (Preferences), nhấp vào tab Nâng cao (Advanced) và đánh dấu hộp liên quan đến Hiển thị menu Phát triển (Show Develop) trong thanh menu.
Bây giờ bạn đã làm cho Console hiển thị, bạn có thể mở nó bằng cách truy cập tab Phát triển (Develop) ở trên cùng và nhấp vào Hiển thị Console lỗi (Show Error Console).
Hãy nhớ rằng Safari có cách hiển thị động error console. Nếu cửa sổ nhỏ khi bạn mở console, bạn sẽ thấy nó trong một cửa sổ hoàn toàn khác biệt.
Nếu bạn muốn mở console trong cùng cửa sổ với trang của bạn, bạn sẽ cần đảm bảo cửa sổ trình duyệt ở kích thước đầy đủ trước khi mở Error console.
