Kayce Basques
Sofia Emelianova
Halaman ini adalah referensi pintasan keyboard di Chrome DevTools.
Anda juga dapat menemukan pintasan di tooltip. Arahkan kursor ke elemen UI DevTools untuk menampilkan tooltip-nya. Jika elemen memiliki pintasan, tooltip akan menyertakannya.
Pintasan keyboard untuk membuka DevTools
Untuk membuka DevTools, tekan pintasan keyboard berikut saat kursor Anda berfokus pada area pandang browser:
| Tindakan | Mac | Windows / Linux |
|---|---|---|
| Membuka panel apa pun yang terakhir Anda gunakan | Command+Option+I | F12 atau Control+Shift+I |
| Membuka panel Konsol | Command+Option+J | Control+Shift+J |
| Membuka panel Elemen | Command+Shift+C atau Command+Option+C | Control+Shift+C |
Pintasan keyboard global
Pintasan keyboard berikut tersedia di sebagian besar, jika tidak semua, panel DevTools.
| Tindakan | Mac | Windows / Linux |
|---|---|---|
| Menampilkan Setelan | ? atau Function+F1 | ? atau F1 |
| Memfokuskan panel berikutnya | Command+] | Control+] |
| Memfokuskan panel sebelumnya | Command+[ | Control+[ |
| Beralih kembali ke posisi docking yang terakhir Anda gunakan. Jika DevTools berada di posisi default selama seluruh sesi, pintasan ini akan melepaskan DevTools ke jendela terpisah | Command+Shift+D | Control+Shift+D |
| Mengaktifkan/menonaktifkan Mode Perangkat | Command+Shift+M | Control+Shift+M |
| Mengaktifkan/menonaktifkan Mode Periksa Elemen | Command+Shift+C | Control+Shift+C |
| Membuka Menu Perintah | Command+Shift+P | Control+Shift+P |
| Mengaktifkan/menonaktifkan Panel Samping | Escape | Escape |
| Muat ulang normal | Command+R | F5 atau Control+R |
| Muat ulang paksa | Command+Shift+R | Control+F5 atau Control+Shift+R |
| Menelusuri teks dalam panel saat ini. Hanya didukung di panel Elemen, Konsol, Sumber, Performa, Memori, JavaScript Profiler, dan Sumber Cepat. | Command+F | Control+F |
| Membuka tab Penelusuran di Panel Samping, yang memungkinkan Anda menelusuri teks di semua resource yang dimuat | Command+Option+F | Control+Shift+F |
| Membuka file di panel Sumber | Command+O atau Command+P | Control+O atau Control+P |
| Memperbesar | Command+Shift++ | Control+Shift++ |
| Memperkecil | Command+- | Control+- |
| Memulihkan tingkat zoom default | Command+0 | Control+0 |
| Menjalankan cuplikan | Tekan Command+O untuk membuka Menu Perintah, ketik ! diikuti dengan nama skrip, lalu tekan Enter | Tekan Control+O untuk membuka Menu Perintah, ketik ! diikuti dengan nama skrip, lalu tekan Enter |
Pintasan keyboard panel Elemen
| Tindakan | Mac | Windows / Linux |
|---|---|---|
| Membatalkan perubahan | Command+Z | Control+Z |
| Mengulangi perubahan | Command+Shift+Z | Control+Y |
| Memilih elemen di atas / di bawah elemen yang saat ini dipilih | Panah Atas / Panah Bawah | Panah Atas / Panah Bawah |
| Memperluas node yang saat ini dipilih. Jika node sudah diperluas, pintasan ini akan memilih elemen di bawahnya | Panah Kanan | Panah Kanan |
| Menciutkan node yang saat ini dipilih. Jika node sudah diciutkan, pintasan ini akan memilih elemen di atasnya | Panah Kiri | Panah Kiri |
| Memperluas atau menciutkan node yang saat ini dipilih dan semua turunannya | Tahan Option, lalu klik ikon panah di samping nama elemen | Tahan Control+Alt, lalu klik ikon panah di samping nama elemen |
| Mengaktifkan/menonaktifkan mode Edit Atribut pada elemen yang saat ini dipilih | Enter | Enter |
| Memilih atribut berikutnya / sebelumnya setelah memasuki mode Edit Atribut | Tab / Shift+Tab | Tab / Shift+Tab |
| Menyembunyikan elemen yang saat ini dipilih | H | H |
| Mengaktifkan/menonaktifkan mode Edit sebagai HTML pada elemen yang saat ini dipilih | Function+F2 | F2 |
Pintasan keyboard panel Styles
| Tindakan | Mac | Windows / Linux |
|---|---|---|
| Membuka baris tempat nilai properti dideklarasikan | Tahan Command, lalu klik nilai properti | Tahan Control, lalu klik nilai properti |
| Berpindah-pindah pada aturan CSS | Panah Atas / Panah Bawah | Panah Atas / Panah Bawah |
| Berpindah-pindah pada properti dan kontrol dalam nilai properti dalam aturan CSS | Panah Kiri / Panah Kanan | Panah Kiri / Panah Kanan |
| Membuka tooltip nilai CSS saat memfokuskan fungsi dalam nilai properti (mis., var, calc, clamp, dll., yang diidentifikasi dengan garis bawah putus-putus) | Option+ Panah Bawah | Alt+Panah Bawah |
| Mengubah representasi nilai warna (mis., RGB, hex, oklch, dll.) | Tahan Shift, lalu klik kotak Pratinjau Warna di samping nilai | Tahan Shift, lalu klik kotak Pratinjau Warna di samping nilai |
| Mengedit properti atau nilai berikutnya / sebelumnya | Klik nama atau nilai properti, lalu tekan Tab / Shift+Tab | Klik nama atau nilai properti, lalu tekan Tab / Shift+Tab |
| Menambah / mengurangi nilai properti sebesar 0,1 | Klik nilai, lalu tekan Option+Panah Atas / Option+Panah Bawah | Klik nilai, lalu tekan Alt+Panah Atas / Alt+Panah Bawah |
| Menambah / mengurangi nilai properti sebesar 1 | Klik nilai, lalu tekan Panah Atas / Panah Bawah | Klik nilai, lalu tekan Panah Atas / Panah Bawah |
| Menambah / mengurangi nilai properti sebesar 10 | Klik nilai, lalu tekan Shift+Panah Atas / Shift+Panah Bawah | Klik nilai, lalu tekan Shift+Panah Atas / Shift+Panah Bawah |
| Menambah / mengurangi nilai properti sebesar 100 | Klik nilai, lalu tekan Command+Panah Atas / Command+Panah Bawah | Klik nilai, lalu tekan Control+Panah Atas / Control+Panah Bawah |
| Berpindah-pindah pada representasi derajat (deg), gradian (grad), radian (rad), dan putaran (turn) dari nilai sudut | Tahan Shift, lalu klik kotak Pratinjau Sudut di samping nilai | Tahan Shift, lalu klik kotak Pratinjau Sudut di samping nilai |
| Menambah / mengurangi nilai sudut sebesar 1 | Klik kotak Pratinjau Sudut di samping nilai, lalu tekan Panah Atas / Panah Bawah | Klik kotak Pratinjau Sudut di samping nilai, lalu tekan Panah Atas / Panah Bawah |
| Menambah / mengurangi nilai sudut sebesar 10 | Klik kotak Pratinjau Sudut di samping nilai, lalu tekan Shift+Panah Atas / Shift+Panah Bawah | Klik kotak Pratinjau Sudut di samping nilai, lalu tekan Shift+Panah Atas / Shift+Panah Bawah |
| Menambah / mengurangi nilai sudut sebesar 15 | Klik kotak Pratinjau Sudut di samping nilai, lalu tekan Shift, klik / geser mouse pada Overlay Jam Sudut | Klik kotak Pratinjau Sudut di samping nilai, lalu tekan Shift, klik / geser mouse pada Overlay Jam Sudut |
Pintasan keyboard panel Sumber
| Tindakan | Mac | Windows / Linux |
|---|---|---|
| Menjeda eksekusi skrip (jika saat ini berjalan) atau melanjutkan (jika saat ini dijeda) | F8 atau Command+\ | F8 atau Control+\ |
| Melangkah ke panggilan fungsi berikutnya | F10 atau Command+' | F10 atau Control+' |
| Melangkah ke panggilan fungsi berikutnya | F11 atau Command+; | F11 atau Control+; |
| Melangkah keluar dari fungsi saat ini | Shift+F11 atau Command+Shift+; | Shift+F11 atau Control+Shift+; |
| Melanjutkan ke baris kode tertentu saat dijeda | Tahan Command, lalu klik baris kode | Tahan Control, lalu klik baris kode |
| Memilih frame panggilan di bawah / di atas frame yang saat ini dipilih | Control+. / Control+, | Control+. / Control+, |
| Menyimpan perubahan pada modifikasi lokal | Command+S | Control+S |
| Menyimpan semua perubahan | Command+Option+S | Control+Alt+S |
| Menuju ke baris | Control+G | Control+G |
| Melompat ke nomor baris file yang saat ini terbuka | Tekan Command+O untuk membuka Menu Perintah, ketik : diikuti dengan nomor baris, lalu tekan Enter | Tekan Control+O untuk membuka Menu Perintah, ketik : diikuti dengan nomor baris, lalu tekan Enter |
| Melompat ke kolom file yang saat ini terbuka (misalnya, baris 5, kolom 9) | Tekan Command+O untuk membuka Menu Perintah, ketik :, lalu nomor baris, lalu :, lalu nomor kolom, lalu tekan Enter | Tekan Control+O untuk membuka Menu Perintah, ketik :, lalu nomor baris, lalu :, lalu nomor kolom, lalu tekan Enter |
| Membuka deklarasi fungsi (jika file yang saat ini terbuka adalah HTML atau skrip), atau set aturan (jika file yang saat ini terbuka adalah stylesheet) | Tekan Command+Shift+O, lalu ketik nama kumpulan deklarasi / aturan, atau pilih dari daftar opsi | Tekan Control+Shift+O, lalu ketik nama kumpulan deklarasi / aturan, atau pilih dari daftar opsi |
| Menutup tab aktif | Option+W | Alt+W |
| Membuka tab berikutnya atau sebelumnya | Function+Command+Atas atau Bawah | Control+Page Up atau Page Down |
| Mengaktifkan/menonaktifkan sidebar Navigasi di sebelah kiri | Command+Shift+Y | Control+Shift+Y |
| Mengaktifkan/menonaktifkan sidebar Debugger di sebelah kanan | Command+Shift+H | Control+Shift+H |
Pintasan keyboard Editor Kode
| Tindakan | Mac | Windows / Linux |
|---|---|---|
| Menghapus semua karakter dalam kata terakhir, hingga kursor | Option+Delete | Control+Delete |
| Menambahkan atau menghapus titik henti sementara baris kode | Fokuskan kursor Anda pada baris, lalu tekan Command+B | Fokuskan kursor Anda pada baris, lalu tekan Control+B |
| Membuka dialog edit titik henti sementara untuk mengedit titik henti sementara bersyarat atau logpoint | Fokuskan kursor Anda pada baris, lalu tekan Command+Alt+B | Fokuskan kursor Anda pada baris, lalu tekan Control+Alt+B |
| Membuka dialog titik henti sementara bersyarat | Command+klik nomor baris | Control+klik nomor baris |
| Membuka dialog logpoint | Command+Shift+klik nomor baris | Control+Shift+klik nomor baris |
| Membuka tanda kurung yang cocok | Control+M | Control+M |
| Mengaktifkan/menonaktifkan komentar satu baris. Jika beberapa baris dipilih, DevTools akan menambahkan komentar ke awal setiap baris | Command+/ | Control+/ |
| Memilih / membatalkan pilihan kemunculan berikutnya dari kata apa pun yang ada di kursor. Setiap kemunculan akan ditandai secara bersamaan | Command+D / Command+U | Control+D / Control+U |
Pintasan keyboard panel Jaringan
| Tindakan | Mac | Windows / Linux |
|---|---|---|
| Menelusuri header, payload, dan respons | Command+F | Control+F |
| Memulai / menghentikan perekaman | Command+E | Control+E |
| Merekam muat ulang | Command+R | Control+R |
| Menyembunyikan detail permintaan yang dipilih | Escape | Escape |
Pintasan keyboard panel Performa
| Tindakan | Mac | Windows / Linux |
|---|---|---|
| Memulai / menghentikan perekaman | Command+E | Control+E |
| Menyimpan rekaman | Command+S | Control+S |
| Memuat rekaman | Command+O | Control+O |
Pintasan keyboard panel Memori
| Tindakan | Mac | Windows / Linux |
|---|---|---|
| Memulai / menghentikan perekaman | Command+E | Control+E |
Pintasan keyboard panel Konsol
| Tindakan | Mac | Windows / Linux |
|---|---|---|
| Menerima saran pelengkapan otomatis | Panah Kanan atau Tab | Panah Kanan atau Tab |
| Menolak saran pelengkapan otomatis | Escape | Escape |
| Menavigasi daftar pelengkapan otomatis ke atas atau ke bawah | Atas / Bawah atau Control+P / N | Atas / Bawah atau Control+P / N |
| Mendapatkan pernyataan sebelumnya | Panah Atas | Panah Atas |
| Mendapatkan pernyataan berikutnya | Panah Bawah | Panah Bawah |
| Memfokuskan Konsol | Control+` | Control+` |
| Menghapus Konsol | Command+K atau Option+L | Control+L |
| Memaksa entri multi-baris. Perhatikan bahwa DevTools seharusnya mendeteksi skenario multi-baris secara default, sehingga pintasan ini biasanya tidak diperlukan lagi | Shift+Return | Shift+Enter |
| Menjalankan | Return | Enter |
| Memperluas semua sub-properti objek yang telah dicatat ke Konsol | Tahan Alt, lalu klik Luaskan > | Tahan Alt, lalu klik Luaskan > |
Pintasan keyboard tab Penelusuran
| Tindakan | Mac | Windows / Linux |
|---|---|---|
| Memperluas/menciutkan semua hasil penelusuran | Command+Option+{ atau } | Control+Shift+{ atau } |
Pintasan keyboard panel Perekam
| Tindakan | Mac | Windows / Linux |
|---|---|---|
| Memulai atau menghentikan perekaman | Command+E | Control+E |
| Memutar ulang rekaman | Command+Enter | Control+Enter |
| Menyalin rekaman atau langkah yang dipilih | Command+C | Control+C |
| Mengaktifkan/menonaktifkan tampilan kode | Command+B | Control+B |
Pintasan keyboard panel Lapisan
| Tindakan | Mac | Windows / Linux |
|---|---|---|
| Memindahkan diagram di sepanjang sumbu X dan Y | W (atas), A (kiri), S (bawah), D (kanan) | W (atas), A (kiri), S (bawah), D (kanan) |
| Mengaktifkan/menonaktifkan mode geser | X | X |
| Mengaktifkan/menonaktifkan mode putar | V | V |
| Mereset posisi dan rotasi diagram | 0 | 0 |
| Memperbesar diagram | Shift++ atau roda mouse ke atas | Shift++ atau roda mouse ke atas |
| Memperkecil diagram | Shift+- atau roda mouse ke bawah | Shift+- atau roda mouse ke bawah |