Yerel depolama alanını görüntüleme ve düzenleme

Sofia Emelianova
Sofia Emelianova

Bu kılavuzda, localStorage anahtar/değer çiftlerini görüntülemek, düzenlemek ve silmek için Chrome Geliştirici Araçları'nı nasıl kullanacağınız gösterilmektedir. Yerel depolama, verileri tarayıcı oturumlarında saklar.

localStorage anahtar ve değerlerini görüntüleme

  1. İncelemek istediğiniz web sitesinde Geliştirici Araçları'nı açın.

  2. Uygulama > Depolama'ya gidin ve Yerel Depolama'yı genişletin. Anahtar/değer çiftlerini görüntülemek için bir alanı tıklayın.

    youtube.com'un anahtar/değer çiftleri.

  3. Tablonun altındaki değeri önizlemek için bir çift seçin.

    Seçilen anahtarın değerini görüntüleme.

Anahtar/değer çiftlerini manuel olarak yenilemek için üst kısımdaki işlem çubuğunda Yenile'ye dokunun. Yenile'yi tıklayın.

Anahtar/değer çiftlerini filtreleme

İhtiyacınız olan bir anahtar/değer çiftini hızlıca bulmak için üstteki filtre kutusuna anahtarı veya değeri içeren bir dize yazın.

"has" dizesini içermeyen anahtar/değer çiftlerini filtreleme.

Yeni bir localStorage anahtar/değer çifti oluşturun

  1. Alanın localStorage anahtar/değer çiftlerini görüntüleyin. Örneğin bu demo sayfasında.
  2. Tablonun boş kısmını çift tıklayın. DevTools yeni bir satır oluşturur ve imleci Anahtar sütununa odaklar.
  3. Yeni bir anahtar/değer çifti girin.

localStorage anahtarlarını veya değerlerini düzenleme

  1. Bir alanın localStorage anahtar/değer çiftlerini görüntüleyin. Örneğin, bu demo sayfasında.
  2. Anahtar veya Değer sütunundaki bir hücreyi çift tıklayarak ilgili anahtarı ya da değeri düzenleyin.
  3. Uygulamak için sayfayı yenileyin.

localStorage anahtar/değer çiftlerini silme

  1. Alanın localStorage anahtar/değer çiftlerini görüntüleme. Örneğin, bu demo sayfasında.
  2. Bir anahtar/değer çiftini tıklayarak seçin.
  3. Seçili çifti kaldırmak için üstteki işlem çubuğunda Sil'e dokunun. Sil'i tıklayın. Seçilen anahtar/değer çifti siliniyor.
  4. İsterseniz tüm çiftleri kaldırmak için Tümünü temizle'ye dokunun. Tümünü temizle'yi de tıklayabilirsiniz.

Console'dan localStorage ile etkileşim kurma

Console'da JavaScript çalıştırabildiğiniz ve Console sayfanın JavaScript bağlamlarına erişebildiği için localStorage ile Console'dan etkileşim kurabilirsiniz.

  1. Geliştirici Araçları'nda Konsol'u açın.
  2. Bulunduğunuz sayfanın dışındaki bir alan adının localStorage anahtar/değer çiftlerine erişmek istiyorsanız en üstteki işlem çubuğunda yer alan bağlam açılır menüsünden ihtiyacınız olan JavaScript bağlamını seçin.
  3. localStorage ifadelerinizi, JavaScript'inizde yaptığınız gibi Console'da çalıştırın.

Console'dan "localStorage" ile etkileşim kurma