JavaScript

JavaScript

• 1. Slide1 JavaScript JavaScript HTML ile oluşturulan ve CSS ile biçimlendirilen web sayfalarına Etkileşim katmak için kullanılan bir programlanma dilidir.
• 2. Slide2 WEB SAYFASI Etkileşim Sunum İçerik + +
• 3. Slide6 JS kodlarının HTML ile çalıştırılması 2 şekilde gerçekleşebilir. 1. HTML içinde etiketi içinde JS’i dışardan .js uzantısıyla ekleyebiliriz 2.HTML içinde nin en sonuna
• 4. Slide7 •Her bir komut satır noktalı virgülle (;) biter. •Büyük küçük harf ayrımı vardır. •Bir nesnenin metodlarına nokta(.) operatörü ile • ulaşılır. •//açıklama satırı •/* birden fazla Açıklama satırı */ JavaScript
• 5. Slide8 Veri Türleri •Number •Boolean •String •Undefined •Null Birincil(ilkel) veri tipi Var ile tanımlayıp değer atamazsak NaN olmasın ama başlagıç değeri olmasın istersek
• 6. Slide9 Veri Türleri(cont.) Object Veri Türü Array literaller var dizi=[ ‘ css ’ , ’ javaScript ’ , ’ html ’ ]; Object literaller var ball={ x:12 , y:12 , radius:30 };
• 7. Slide10 Tür Dönüşümleri var a=‘2’; var b= 3; var c= a*b; * operatörü a değişkeninin veri türünü number’a çevirir. c=6 olur var a=‘ali’; var b= 3; var c= a+b; + operatörü b değişkeninin veri türünü stringe çevirir. c = ‘ali3’ olur
• 8. Slide11 Document Object Model (DOM) •Dilden bağımsız bir programlama arayüzüdür. •Dom herbir HTML elemanı için arayüz tanımlama dilini kullanarak bir arayüz tanımlamaktadır. • Tarayıcılar bu arayüzleri kullanarak her bir HTML elemanı için birer nesne oluşturur. •Hiyerarşik bir yapıda oluşturulurlar.
• 9. Slide3 Document html ‘’DOM’’ title head body h1 ‘’Belge Nesne Modeli’’ Her bir kutucuk içeriği bir node(düğüm) oluşturmaktadır. Document Belge Nesne Modeli
• 10. Slide12 Document Nesnesinin Özellikleri •activeElement : Geçerli belge üzerindeki elemanın referansını verir. •ancors : Belge içindeki HTMLcollection nesnesini elde ederiz. •body : body elemanının referansını elde etmek için. •characterSet : meta elemanı içindeki karakter kodlamasını elde etmek için •compatMode : tarayıcı tarafından hangi modda çalıştırıldığını •cookie : çerez oluşturmak ya da bilgisayardaki çerezleri elde etmek •defaultView : windows nesnesini elde etmek için •designMode : düzenlenir olup olmadığını gösteren değer alır
• 11. Slide13 •dir : belge içindeki metinlerin yazılış yönünü ayarlamak için •doctype : belgenin döküman türü •documentElement : html elemanının referansını Element nesnesi olarak elde etmek için •documentURI : geçerli sayfanın URI adresini metin olarak döndürür. •embeds : Belge içindeki Object etiketi ile gömülmüş elemanların listesi •forms : Belge içindeki Form elemanlarının listesini saklayan •head : Belge içinde tanımlanan head elemanlarınınn referansını elde ederiz •images : Belge içindeki img elemanlarının listesini saklayan •implemantation : belge ile ilgili DOMImplementation nesnesi döndürür.
• 12. Slide14 •lastModified : belgenin son güncelleme tarihini ve saatini elde etmek için kullanılır. •styleSheets : stil sayfalarını içeren StyleSheetList türünden bir nesne elde etmek •links : belgedeki tüm linklerin listesini saklayan •location : belgenin URL adresini ayarlamak için kullanılır. •plugins : belge içerisindeki embed etiketi ile gömülmül elemanların listesini saklayan •readyState : belge içeriğinin tarayıcı tarafından yüklenme durumunu gösteren değer. •scripts : belge içerisinde script elemaların listesini saklayan Örnek : document.scripts , document.links , document.cookie
• 13. Slide5 SOURCE •https://www.webcebir.com/ •https://www.kodlab.com/ •https://www.udemy.com/sfrdan-ileri-seviyeye-modern- javascript-kursu •http://uzmanimakademi.net/