• Sonuç bulunamadı

ile text hizalama işlemleri nasıl yapılır ? Bootstrap text-align sınıfları nedir ve nasıl kullanılır?

Belgede WEB VE İNTERNET TEKNOLOJİLERİ (sayfa 59-107)

Bootstrap typography nedir ve nasıl kullanılır? Bootstrap text etiketlerini nasıl kullanırız? Text truncate nedir?

Bootstrap 4 ile text hizalama işlemleri nasıl yapılır ? Bootstrap text-align sınıfları nedir ve nasıl kullanılır?

<p style="width:150px;" class="text-truncate">

Komple Uygulamalı Web Geliştirme Eğitimi </p>

<p style="width:200px;" class="text-truncate">

Komple Uygulamalı Web Geliştirme Eğitimi </p>

<p style="width:500px;" class="text-truncate">

Komple Uygulamalı Web Geliştirme Eğitimi </p>

</div>

______________________________________________________________

Bootstrap Text Align & Display

Bootstrap 4 ile text hizalama işlemleri nasıl yapılır ? Bootstrap text-align sınıfları nedir ve nasıl kullanılır?

Css bölümünde text-align işlemlerinin ve display özelliğinin css kodları yazılarak nasıl yapıldığını öğrendik.

Bootstrap 4 ile gelen text-align ve display kavramları için kullanabileceğimiz bazı bootstrap text-align ve bootstrap display class' ları mevcuttur. Bu bootstrap sınıflarını kullanarak text hizalama ve display özelliklerini çok daha basit olarak kullanabiliriz.

Bootstrap 4' de Text Hizalama Nasıl Yapılır ?

Bootstrap 4' de kullanabileceğimiz text-align özelliğinin alabileceği değerler;

text-justify => block etiket içindeki yazıları iki yana hizalar.

text-right => block etiket içindeki yazıları sağa hizalar.

text-left => block etiket içindeki yazıları sola hizalar.

HTML CSS

<div class="container"> p{

W e b v e İ n t e r n e t T e k n o l o j i l e r i | 59

<p class="text-justify">

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam

commodi rerum minus laborum ab delectus quo id quisquam debitis a! Ut quibusdam eveniet eaque voluptatibus, adipisci accusantium ipsa consequatur error!

</p>

<p class="text-right">

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam

commodi rerum minus laborum ab delectus quo id quisquam debitis a! Ut quibusdam eveniet eaque voluptatibus, adipisci accusantium ipsa consequatur error!

</p>

<p class="text-left">

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam

commodi rerum minus laborum ab delectus quo id quisquam debitis a! Ut quibusdam eveniet eaque voluptatibus, adipisci accusantium ipsa consequatur error!

Bootstrap 4' de Display Nasıl Kullanılır ?

Css display özelliği ile yazdığımız css kodlarını bootstrap 4 ile gelen hazır display sınıfları ile çok daha kolay bir şekilde kullanabiliriz.

** Bir etiketi block bir etikete çevirmek için d-block sınıfını kullanabiliriz.

** Bir etiketi inline bir etikete çevirmek için d-inline sınıfını kullanabiliriz.

** Bir etiketi inline-block bir etikete çevirmek için d-inline-block sınıfını kullanabiliriz.

<div class="container p-3">

<!-- Inline to Block -->

W e b v e İ n t e r n e t T e k n o l o j i l e r i | 60

<div class="bg-warning d-inline">d-inline</div>

<div class="bg-warning d-inline">d-inline</div>

<br><br>

<!-- Inline Block-->

<div class="bg-primary d-inline-block">

<h3>Product Name</h3>

Description </div>

</div>

** display:none; ile bir nesneyi görünmez hale getirebilriz.

Bu işlemi bootstrap ile yapmak istersek .d-none sınıfını kullanmamız gerekir.

Bootstrap 4' de Text Hizalama ve Display Özelliklerini Responsive Tasarımlar için Nasıl Kullanabilirim ?

Bootsrap 4' de responsive tasarımlar için kullanabileceğimiz ve belli çözünürlük değerlerine sahip responsive class' ları mevcuttur.

Boostrap 4 'ün kullandığı breakpoint aralıkları aşağıda verilmiştir.

Örneğin kullanıcı sitemizi telefondan ziyaret ediyorsa yani tarayıcının genişliği mininum 576px ise bu durumda ilk media query aralığındaki css kodları çalışacaktır. Yani ziyaretçilerin hangi çözünürlük arasındaki tarayıcıya sahip olup olmadığını media query aracılığıyla sorgulatıp tespit etmemiz ve ona göre css kodu yazmamız gerekir.

Telefondan gelen bir kullanıcı için kullandığımız font büyüklüğü ile geniş ekranlı bir tarayıcı kullanıcısının font büyüklüğü aynı olmamalıdır.

// Small devices (landscape phones, 576px ve yukarısı)@media (min-width: 576px) { ... }// Medium devices (tablets, 768px ve yukarısı)@media (min-width: 768px) { ... }// Large devices (desktops, 992px ve yukarısı)@media (min-width: 992px) { ... }// Extra large devices (large desktops, 1200px ve yukarısı)@media (min-width: 1200px) { ... }

Tüm bu breakpoint sayısal değerlerini media query 'leri ile kullanmaktansa bootstrap 4 ile gelen hazır responsive ön ek class' ları kullanmamız çok daha kolay.

** Small cihazlar için .sm

W e b v e İ n t e r n e t T e k n o l o j i l e r i | 61

** Medium cihazlar için .md

** Large cihazlar için .lg

** Eksta Large cihazlar için .xl

Bootstrap responsive ön ekleri ile text hizalamayı nasıl yaparız ?

<div class="container p-3">

<p class="text-sm-right bg-primary">Right aligned on small or larger</p>

<p class="text-md-right bg-primary">Right aligned on medium or larger</p>

<p class="text-lg-right bg-primary">Right aligned on large or larger</p>

<p class="text-xl-right bg-primary">Right aligned on xl or larger</p>

</div>

** ilk içeriğimiz small ve üstündeki tarayıcılarda sağa hizalanır yani .text-rightsınıfımız small cihazlar için etkin olacaktır.

** ilk içeriğimiz medium ve üstündeki tarayıcılarda sağa hizalanır yani .text-right sınıfımız small cihazlar için etkin olacaktır.

** ilk içeriğimiz large ve üstündeki tarayıcılarda sağa hizalanır yani .text-right sınıfımız small cihazlar için etkin olacaktır.

** ilk içeriğimiz ekstra large tarayıcılarda sağa hizalanır yani .text-right sınıfımız small cihazlar için etkin olacaktır.

Her bir aşamada bir sonraki breakpoint aralığını kullandığımıza dikkat ediniz.

Aynı şekilde .text-left ve .text-justify sınıflarını responsive ön ekleri ile birlikte kullanabilirsiniz.

________________________________________________________________________

W e b v e İ n t e r n e t T e k n o l o j i l e r i | 62

JAVASCRIPT

Bu bağlantıyı tıkladığınıza göre artık şu işi kes-yapıştırdan ileri götürmek istiyorsunuz. Bizim de amacımız bu. Size JavaScript'in genel özelliklerini ana hatlarıyla vermek. Bundan sonrası size kalmış. Genel yazım kurallarını öğrendikten sonra yapılabilecek en güzel şey diğer webcilerin yazdıkları javascript kodlarını incelemektir.

Gelelim JavaScript'in genel bazı özelliklerine. Başlangıçta bazı konulara açıklık getirelim.

Java ile JavaScript oldukça fazla derecede karıştırılmakta. Java Sun firması tarafından Pascal ve Delphi dillerinden esinlenerek yazılmış bir programlama dilidir. Sonuçta tarayıcıdan bağımsız bir program elde edersiniz. Yani bir exe veya com uzantılı dosya vardır elinizde. Fakat JavaScript bu tür bir programlama dili değildir. Yorumlanması için bir tarayıcıya ihtiyaç duyar. Bu yüzden script dilidir. Html dosyasını içine gömülüdür.

Sonuçta elinizde exe veya com uzantılı bir dosya yoktur. Javascript Netscape firması tarafından C dilinden esinlenilerek yazılmıştır. Yazılma amacı Html'in sahip olmadığı bazı özelliklerin web sayfalarında kullanılmak istenmesidir. Yani ziyaretçi ile etkileşim gibi önemli unsurlar Html'de yok veya oldukça az kapasitede diyebiliriz. Netscape firması bu konuya ağırlık vererek JavaScript script dilini internet ortamına kazandırmıştır.

Gelelim Netscape ve Internet Explorer tarayıcılarının JavaScript kodundaki farklı anlayışa.

Bu gerçekten doğrudur. Netscape firması JavaScript dilini hazırladığında Microsoft firması bu dilin özelliklerini veya yazılım tarzını tam anlamıyla Internet Explorer'a eklemedi. Kendi yazım kurallarını belirledi. Bu yüzden biz JavaScript kodu yazarken bu iki tarayıcı özelliklerini de göz önünde bulundurmalıyız. Fakat bu her kodda karşımıza çıkmaz.

JAVASCRİPT TARİHİ

Netscape Navigator 2.0 ile birlikte Brendan Eich tarafından geliştirilen ve önceleri Mocha daha sonra LiveScript olarak adlandırılan ve en sonunda şu anki adını alan JavaScript dili başlangıçta sadece istemci taraflı (client-side) yorumlanan (interpreted) bir dildir. Aralık

W e b v e İ n t e r n e t T e k n o l o j i l e r i | 63 1995 tarihinde, C dilinin tarayıcılara uyarlanmış hali diyebileceğimiz JavaScript piyasaya sürüldü. Web sayfalarında dinamik içerik sağlamak ya da kullanıcıyla iletişim kurmak için kullanılmaktadır.

Ad benzerliğine karşın 'Java' ile ilişkili değildir. Yaygın yanlışlardan biri JavaScript'in

basitleştirilmiş Java olarak tanımlanmasıdır.

Başlangıçta yalnız Netscape tarayıcıları üstünde çalışan JavaScript artık tüm yaygın ağ taraycıları tarafından desteklenmekte. Microsoft JavaScript'e benzer bir dil olan JScript'i geliştirdi. Microsoft Internet Explorer her iki dili de desteklerken standart olmayan JScript eklentileri diğer tarayıcılar üstünde çalışmamaktadır

JAVA VE JAVASCRİPT ARASINDAKİ FARKLAR NELERDİR?

Her ne kadar adları birbirinin nerdeyse aynısı olsa da Java ile JavaScript aynı şeyler değildir. Java bir programlama dilidir, JavaScript ise bir scripttir (Adından anlaşıldığı gibi).

Farkları ise; Java ile gerçek programlar yazarsınız ancak program yazmakla uğraşmadan güzel şeyler yaratmak istenildiğinden ve ağır çalıştığından dolayı Java çok yaygınlaşmamıştır. JavaScript, ayrı bir programlama dilinden çok HTML'nin bir uzantısıdır denebilir. Tabii ki bu 'resmi' bir tanımlama değil, ama Java ve JavaScript arasındaki farkı anlatmak için iyi bir tanımlamadır.

JAVASCRIPT'İN GENEL ÖZELLİKLERİ

1. Javascript kodlarını yazmak için Windows kullanıcıları için NotePad Mac. kullanıcıları

için Simple Text yeterlidir.

2. JavaScript kodları --> etiketi ile biter.

3. <script> etiketi JavaScript'i anlamayan eski sürüm tarayıcıların bu kısmı geçmeleri içindir.

5. İyi bir programcı kod satırlarında açıklama yapar. Bu satır şu işlemi gerçekleştiriyor gibi açıklayıcı bilgiler yazar kodlarının yanına. JavaScript'te bu tür açıklama // ile başlar ve //

ile biter. Eğer açıklamanız bir satırdan fazla ise /* ile başlar */ ile biter.

// bu satır kullanılacak değişkenlerin tanımlanması içindir.

/* açıklama satırı 1

açıklama satırı 2

açıklama satırı 3 */

W e b v e İ n t e r n e t T e k n o l o j i l e r i | 64

6. JavaScript kodları Html kodların arasında yer alır. Veya uzantısı .js olan dosyalarda saklanarak yine Html içerisinden çağırılır. Java Appletleri gibi Html'den ayrı bir unsur

değildir. Javascript Html'in bir parçasıdır.

7. Kullanılacak yere göre Html'in içerisinde kullanılır. Fakat genelde <head> .</head>

etiketleri arasında kullanılır.

8. Javascript kodları bittiğinde elinizde asla kendi başına çalışan uzantısı exe veya com olan bir dosya olmaz. Her zaman için tarayıcı tarafından yorumlanması gerekir.

Yorumlanması demek Javascript kodunun çalışması anlamındadır.

9. Nesne ve buna uygulanan olaylar ile ilgili bir takım görevleri vardır. Javascript kullandığı her unsuru nesne olarak algılar. Siz bu nesneleri tıklamak üzerine gelmek üzerinde çıkmak gibi olaylar ile çalıştırırsınız ki bu da Javascript'in ziyaretçi ile etkileşmesi demektir.

10. Genel öğrenim yapımız diğer programlama dillerine nazaran biraz farklı olacaktır. Bu Javascript'in bir script dili olmasında ileri gelir.

JAVASCRİPT'LERİ ÇALIŞTIRMAK

JavaScript'i destekleyen ilk tarayıcı Netscape Navigator 2.0 idi. Tabii ki daha yeni versiyonlar da bu dili destekliyor. Her ne kadar değişik versiyonlarda bazı problemler olsa da JavaScript'i tüm Netscape ailesi destekleyecektir. Bununla beraber yakın gelecekte tüm tarayıcılar JavaScript'i destekleyeceklerdir. Örneğin yakında çıkacak olan Microsoft Internet Explorer 3.0 JavaScript desteğiyle piyasaya sürülecektir. Yani JavaScript gelecekte çok yaygın olacağından bu tekniği şimdiden öğrenmek faydalı olacaktır.

Gördükçe anlayacaksınız ki JavaScript yazmak gerçekten de çok kolay. Size gereken sadece birkaç ana teknik ve çevrenizde aynı konuyla uğraşan, bilgi alışverişi

yapabileceğiniz kişiler bulmaktan ibaret olacaktır.

Tabii ki JavaScript öğrenebilmeniz için öncelikle HTML hakkında bilgi sahibi olmanız gerekli. HTML hakkında Internet'te birçok kaynak mevcuttur. Yahoo'da 'html' konu başlığını ararsanız pek çok kaynak bulabilirsiniz.(Bu kaynaklar piyasadaki kitaplardan çok daha faydalıdır çünkü sürekli güncellenmektedirler. Internet'in büyüme hızına başka türlü yetişmeniz biraz zor.)

JAVASCRİPT İLE NE YAPİLABİLİR NE YAPILAMAZ ?

1. JavaScript ile web de her türlü uygulama yapilabilir mi? Mesela bir klasörün icindeki dosyalari listeleyip orada istedigimiz bir dosyayi sürükleyerek (drag drop) baska bir klasöre atabilecek bir uygulama yapmak istedigimiz zaman bunu tamamen JavaScript ile yapabilir miyiz?

2. Kevin dayımında dediği gibi hiçbir şey imkansız değildir.

3. Javascript bir dildir. Client tarafında çalıştığı zaman client'ta yapılabilecek işleri yapar, server'da çalıştığı zaman server'da yapılabilecek işleri yapar.

Javascript dilini;

W e b v e İ n t e r n e t T e k n o l o j i l e r i | 65 4. ASP kodlarınızı yazarken kullanıyorsanız, server tarafında dosyalar oluşturabilir,

kopyalayabilir, silebilirsiniz.

5. Windows Scripting Host bağlamında sistem üzerinde çalışacak batchleri yazmada kullanıyorsanız gene dosyalar oluşturmak, silmek, ziplemek mümkün.

6. Eğer bir web sitesinin client tarafındaki * scripting ihtiyacını karşılamak için kullanıyorsanız bu durumda dosyalar oluşturamaz, silemezseniz. Browser üzerinde çalışan script'ler client bilgisayarın dosya sistemine, bağlı bulunduğu ağa, kurulu programına, vs. erişemez. Bu durumda Javascript ile sadece HTML sayfası bağlamında işler yapabilirsiniz. Form validation, DHTML DOM gibi. (Eğer AJAX kullanırsanız, sayfa refresh olmadan serverdan taleplerde bulunabilirsiniz. Bu Javascript'in client tarafında daha çok iş yapabiliyormuş gibi görünmesine neden olur. Aslında yapılan iş server tarafındadır.)

Sonuç olarak Javascript, DHTML DOM ile birlikte client tarafında harika bir UI dilidir.

Ancak server tarafındayken UI ile hiç bir ilgisi yoktur, batch neyin programlamaya yarar.

7. Hotmailin beta versiyonunda mesela emaili sectikten sonra sürükle birak ile bir klasöre birakabiliyosun o emaili. Böyle birsey nasil yapilabilir? Php ve javascript beraber kullanarak yapilabilir sanirim. Ben daha önce JSP ve PHP de birseyler yapmistim ama bu tür birsey bana degisik geldi. Bununla ilgili tabiiki googleda bol miktarda dokuman var ama bildiginiz güzel dokuman sitesi var mi?

8. Javascript ile çok değişik şeyler yapılabilir. Hotmail'in maillerin klasörlere sürüklenebilmesini sağlaması sadece bir örnek. Böyle bir şeyi yapmak için şu tarz bir çalışma yapabilirsiniz:

a. Bir mailin üzerindeyken farenin sol tuşuna basılmasıyla birlikte çalışan onmousedown eventi drag&drop işlemini başlatır. Bu başlatma işlemi genellikle dragging adındaki bir değikene true değerini atamakla ifade edilir.

b. Farenin sol tuşu bırakıldığında dragging=false ile sürükleme işlemi bitirilir.

c. Eğer sürükleme işleminin bittiği koordinatlarda bir klasör var ise seçili mail bu klasöre taşınır. Bu taşıma işlemi client tarafında DHTML ile görsel hale getirilirken, server tarafında bir AJAX talebiyle çaktırmadan uygulanır..

JAVASCRİPT DİLİ

Netscape Navigator 2.0 ile birlikte geliştirilen JavaScript dili istemci taraflı (client-side) script dilidir. Web sayfalarında dinamik içerik sağlamak ya da kullanıcıyla iletişim kurmak için kullanılır.

İlk başta yalnızca Netscape tarayıcıları için tasarlanan JavaScript, daha sonra diğer tarayıcılar tarafından da desteklenen genel bir scripting dili haline gelmiştir. Şu anda Navigator 4.0 tarafından desteklenen JavaScript 1.2 sürümü vardır. Microsoft Internet Explorer 3.0 ile JavaScript 1.0'ı desteklemektedir.

İPUCU: HTML kodları arasına yerleştirilen küçük kodlardır. Tek başına .js uzantılı JavaScript kodları da yazılabilir.

W e b v e İ n t e r n e t T e k n o l o j i l e r i | 66 JavaScript, Java dilinin bir Light versiyonu değildir. JavaScript kendi başına bir script dilidir. Genellikle HTML sayfalarında kullanıcı kontrolleri eklemek, formları kontrol etmek, hesaplamalar yapmak gibi işler için kullanılır.

JAVASCRİPT NEREDE KULLANILIR?

JavaScript kullanımının iki ana alanı vardır: istemci taraflı ve sunucu taraflı script yazmak.

Şu anda HTML sayfalara gömülü yazılan scriptlerin çoğu JavaScript kullanılarak yazılmaktadır. Bunlar da genellikle kullanıcı bilgilerinin doğru girilip girilmediği ya da kullanıcıya veri girişinde ya da menü kullanımında seçenekler sağlamaktır.

Sunucu taraflı JavaScript, aynı ASP gibi çalışmaktadır.

Sunucu Taraflı JavaScript

Sunucu taraflı JavaScript (SSJS) ise temel JavaScript'e ek olarak nesneler ve işlevler katılarak veritabanlarına erişim, e-mail gönderme ve diğer işlemlerin yapılması sağlanır.

SSJS, veritabanı temelli Web uygulamalarının yaratılmasını sağlar.

<SCRIPT> ETİKETİ

Bir tarayıcının anlayacağı temel dil HTML'dir. JavaScript dilinin HTML belgesi içinde yazılabilmesi için <SCRIPT> etiketleri kullanılır.

HTML-Kodu:

HTML BELGESİ İÇİNDE JAVASCRIPT YAZMAK

Bir Web sayfası organizasyonunda JavaScript'leri Web sayfasına eklemek için değişik yollar vardır:

9. HEAD bölümünde

W e b v e İ n t e r n e t T e k n o l o j i l e r i | 67 10. BODY bölümünde

11. BODY içinde URL olarak.

1. <HEAD> İçinde:

Bir HTML belgesinde HEAD bölümü içinde <SCRIPT> etiketi kullanarak istediğiniz JavaScrip kodunu HTML belgesine ekleyebilirsiniz. Bu kodlar HTML sayfasının BODY kısmı yüklendikten sonra kullanıma hazır hale gelir.

Örnek HTML-Kodu:

HTML belgesinin BODY kısmında JavaScript kullanmak için iki yol vardır:

Doğrudan çalışacak kodlar ve kullanıcı tarafından çalışacak kodlar:

Doğrudan çalışacak JavaScript kodları <SCRIPT> etiketi kullanılarak HTML belgesinin istenilen yerine yazılır. Bu cümleler tarayıcı tarafından okunduğu anda yerine getirilir:

<SCRIPT TYPE="text/javascript">

<!--

document.write("Son okunma tarihi" + document.lastModified) //-->

</SCRIPT>

Daha çok kullanılan diğer bir yöntem ise kullanıcı tarafından bir olayın başlatılmasıyla bir JavaScript kodunun çalıştırılmasıdır. Örneğin bir düğmeye tıklamak gibi:

<FORM>

<INPUT TYPE="BUTTON" NAME="TestButton" VALUE="Tıkla"

onClick="AlertTest()">

W e b v e İ n t e r n e t T e k n o l o j i l e r i | 68

</FORM>

ÖrnekHTML-Kodu:

<SCRIPT Language="JavaScript">

function Onceki() {

if (xmldso.recordset.bof){

alert("Dosya başındasınız.");

} else{

xmldso.recordset.movePrevious()

if (xmldso.recordset.bof){

xmldso.recordset.moveFirst();

alert("Bu ilk kayıt.");

} } }

function Sonraki() {

if (xmldso.recordset.eof){

alert("Dosya sonundasınız.")

} else{

xmldso.recordset.moveNext()

if (xmldso.recordset.eof){

<A HREF="javascript: alert('Son!')">Siteden Çık</A>

JAVASCRİPT DİLİNİN ÖZELLİKLERİ

JavaScript dilinin temel gramer yapısına bir bakalım:

İşletme Sırası:

W e b v e İ n t e r n e t T e k n o l o j i l e r i | 69 HTML belgesinde JavaScript eklendiğinde, kodun işletimi sırasıyla yapılır. Ancak fonksiyon ve belli bir olaya (ONCLICK gibi) bağlı olan JavaScript kodlarının işletimi o anda yapılır.

Değişkenler:

Bir değeri içeren bellek adlarını ifade ederler.

İşleçler (Operators):

Değerler ya da değişkenler arasında toplama, çıkarma gibi işlemlerin yapılmasını sağlarlar. İşleçler +, *, /, - gibi işaretlerle kullanılır.

İfadeler (Expression):

Değişkenlerin, işleçleri ve deyimlerin bir araya gelerek oluşturdukları yapılara ifade derin.

Örneğin: "Ucret = Gün * Yevmiye" formülü bir ifadedir.

Deyimler (Statements):

Deyimler belli bir komut ya da söz dizimi bileşenlerinin grubuna verilen addır. Örneğin bir komut ya da bir IF yapısı deyimi oluşturur:

Kod:

if (toplam>20) {deyimler;} else {deyimler;}

Nesneler (Objects)

Kendi değerleri, özellikleri ve işlemleri olan bileşenlere nesne (object) denir. JavaScript dilinde çok sayıda yerleşik nesne vardır.

Fonksiyonlar (Functions) Bir JavaScript fonksiyonu diğer dillerdeki bir fonksiyon yordam ya da bir alt yordam anlamına gelir. Bir fonksiyon bir dizi işlemi yerine getirir ve bir sonuç döndürür.

Ayrıca fonksiyonlar, parametre olarak kabul edilen birçok değer kabul ederler.

Kod:

Case Sensitivity JavaScript case sensitive (büyük küçük harf duyarlı) bir dildir. Değişkenler ve diğer öğeler küçük ya da büyük yazılabilirler. Ancak A değişkeni ile a değişkeni birbirinden

W e b v e İ n t e r n e t T e k n o l o j i l e r i | 70

Test= "BÜYÜK HARF";

document.writeln("test = "+test+"<BR>");

document.writeln("TEST = "+TEST+"<BR>");

//-->

</SCRIPT>

Açıklamalar

Bütün programlama dillerinde olduğu gibi, kod yazarken açıklama yazmak için kullanabileceğimiz bir karakter vardır. JavaScript'te bu <!- ve //-->. işaretlerinin arasıdır.

Kod:

<!--bu bir açıklamadır //-->.

JavaScript kodu diğer programlama dillerinde olduğu gibi deyimlerden (statements) oluşur. Bu deyimler atama, değerleri karşılaştırma ve işlemlerin yapılması için komutlar anlamına gelmektedir.

_______________________________________________________

Collapse - Java özelliği

http://getbootstrap.com/docs/4.0/components/collapse/

W e b v e İ n t e r n e t T e k n o l o j i l e r i | 71 HTML

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Java Script Ders</title>

</head>

<body>

<h1>JavaScript`e Giris</h1>

<meta charset="UTF-8">

<title>Java Script Ders</title>

</head>

<body>

<h1>JavaScript`e Giris</h1>

<input type="button" value="tıklayın"

onclick="dilekMesaj()" >

<script src="script.js"

type="text/javascript"></script>

alert("Merhaba arkadaşlar.Bu benim ödevim.") ;

}

Değişkenler

W e b v e İ n t e r n e t T e k n o l o j i l e r i | 72

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Document</title>

</head> deposuna sahip ve maksimum '+maxhiz+'km hız yapmaktadır.'+'Peki araç otomatik midir ? '+otomatik);

Bir öğrencinin bilgilerini alıp notunu hesaplayan programı yapalım.

W e b v e İ n t e r n e t T e k n o l o j i l e r i | 73

<meta charset="UTF-8">

<title>Document</title>

</head>

var ad = prompt("adınızı giriniz : ");

// var ogrno = 1123;

var ogrno = prompt("öğrenci no : ");

// var cinsiyet = true;

var cinsiyet = prompt("cinsiyet : "); // erkek : true kadın : false

dersinden aldığı ortalama " + ortalama);

Operatörler

/* 1- Matematiksel Operatörler */

var x = 10;

var y = 20;

W e b v e İ n t e r n e t T e k n o l o j i l e r i | 74 var z= 10;

console.log(x+y);

console.log(x-y);

console.log(y/x);

console.log(x*y);

console.log(x*y+z);

console.log(x*y+z);

Belgede WEB VE İNTERNET TEKNOLOJİLERİ (sayfa 59-107)