Anasayfa / Yazılım / Javascript / Javascript(jquery) Debug

Javascript(jquery) Debug

Bu konuyla ilgili ikinci makaleyi bu bölüm üzerine yazmak istiyorum. Çünkü debug edemediğimiz kodu tam olarak anlayabilmemiz mümkün değil. En azından benim için öyle :). Bu konuyu Asp.net eksenli anlatacağım. Javascript kodunu debug etmek için iki yöntem bulunuyor. Bu iki yöntemde tarayıcılara göre farklılık gösteriyor. Ilk önce Internet Explorer’i ele alalim ki ben kendisini hiç sevmem 🙂 IE’nin debug modunu öncelikle etkin hale getirmek gerekiyor. Asagida bulunan ekran görüntüsünde oldugu gibi bu modu aktif hale getirebilirsiniz.

 

 

 

 

 

 

 

 

 

 

 

 

 

Ve varsayılan tarayıcı olarak ayarlamalısınız.

Sonrasında Visual Studio’da herhangi bir kodu debug eder gibi breakpoint koyabilirsiniz.

Ikinci olarak Google Chrome ile debug’tan bahsedeceğım. Varsayılan tarayıcı yapmaya gerek yok. Ancak debug konsolunu açmanız gerekiyor. Bu işlem için ya CTRL+SHIFT+J tus kombinasyonu kullanacaksınız ya da asağıdaki şekilde ayarlardan konsolu açmanız gerekiyor.

Konsolun kullanımına baktığımızda :

Kodun istenilen satırına break point koyuyoruz. Ve sonrasında sayfayı bir kere refresh (F5) ediyoruz. Debug sayfada yukarından asağıya dogru olarak yapılıyor. Eger bir jquery kütüphanesi eklediyseniz mutlaka bu kütüphanenin içine girip duruyor. Geçmek için ya F8 tusuna basın ya da sağ tarafinda bulunan butonlardan kırmızı kutu içerisine aldığımı kullanın. Eğer başka bir kütüphane yoksa sonrasında büyük ihtimalle sizin break point koydugunuz yere gelecektir.

Sonrasında fare ile üzerine gelip point koyduğumuz yerdeki değiskenin değerine bakabiliriz. F10 ya da yesil kutu ile belirttiğim yerdeki buton yardımıyla diğer değişkenleri izleyebilirsiniz. Sağ taraflarında yer alan butonlarla ‘da ileri-geri bir sonraki fonksiyona ilerleyebiliyorsunuz.

Son olarak Firefox’tan bahsedeceğim. Ancak Chrome ile firefox’un kullanımı hemen hemen aynı o sebeple çok fazla üzerinde durmayacağım. Öncelikle firebug ekletisini asagidaki linkten indirip kurmanız gerekiyor.

Link

Linkteki sayfada kullanımı geniş bir şekilde  anlatılıyor. Aktif hale getirmek için aşağıdaki gibi ya böcek ikonu üzerine tıklıyorsunuz ya da On for Web Pages ile tüm sayfalarda bu konsolü aktif hale getirebiliyorsunuz. Sonrasında kullanımı aynı google chrome’da oldugu gibi. Malum 2011 Kasim ayında bu iki firma browser konusunda yollarını ayırdı. Ikisi de hemen hemen aynı alt yapıyı kullanıyorlardı.

Kolay gelsin…

Bu yazı hakkında ne düşünüyorsunuz?
  • Sıkıcı (0)
  • Faydalı (0)
  • İlginç (0)
  • Başarılı (0)

Hakkında Murat KIRMIZIGÜL

- Gaziantep doğumlu - Bilgisayar Mühendisi - Yazılım Geliştirici-Proje Yöneticisi - Siyaset, Tarih, Sosyoloji, Fotoğrafçılık sever - Evli ve Ayaz'ın babası :)

Cevapla

E-posta adresiniz yayınlanmayacak.Gerekli alanlar işaretlenmişlerdir *

*

13 − 4 =

Yukarı çık