• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
7 pemrograman internet  javascript
 

7 pemrograman internet javascript

on

  • 1,006 views

PEMROGRAMAN INTERNET - JAVASCRIPT

PEMROGRAMAN INTERNET - JAVASCRIPT

Statistics

Views

Total Views
1,006
Views on SlideShare
1,006
Embed Views
0

Actions

Likes
1
Downloads
53
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    7 pemrograman internet  javascript 7 pemrograman internet javascript Presentation Transcript

    • Java ScriptBikin Website tambah Interaktif..
    • Toni Tegar Sahiditonitegarsahidi@gmail.com
    • JavaScript#1 Apa itu JavaScript?#2 JavaScript Kenalan SIngkat#3 Kemampuan JavaScript#4 Document Object Model#5 Programming Features
    • #1 Apa itu JavaScript 1/6
    • Bahasa Scripting pada Website
    • Bahasa Scripting pada Website
    • Bahasa Scriptingadalah bahasa pemrograman yang ringan (lightweight)
    • JavaScript didesain untuk menambahinteraktifitas sebuah website
    • JavaScriptDijalankan oleh Browser dan bukan Server
    • Artinya?
    • bisa di-disable olehpengunjung website
    • #2 JavaScript QuickStart 1/6
    • fungsi JavaScript berada di <script>...</script>
    • e.g.
    • <head><script>function displayDate(){document.getElementById("demo").innerHTML=Date();}</script></head>
    • <body><h1>My First JavaScript</h1><p id="demo">This is a paragraph.</p><button type="button"onclick="displayDate()">DisplayDate</button></body>
    • sebelum di-klik
    • sesudah di-klik
    • #3 Kemampuan JavaScript 1/6
    • Kemampuan JavaScript# Menulis Output ke HTML# Mengganti konten HTML# Bereaksi terhadap Event (misal klik)# Mengubah Style HTML# Mengecek sebuah input
    • #1 Menulis Output ke HTML
    • <head><script>function lakukanSesuatu(){document.write("<p>Ini paragraf yang ditulisJavaScript</p>");}</script></head>
    • ...<button type="button"onclick="lakukanSesuatu()">Sesuatu</button>...
    • #2 Mengganti Konten HTML
    • <head><script>function lakukanSesuatu(){x=document.getElementById("demo");x.innerHTML="Hello";</script></head>
    • #3 Interaksi terhadap Event
    • <button type="button"onclick=“lakukanSesuatu()">Click Me!</button>
    • #4 Mengubah Style HTML
    • <script>function lakukanSesuatu(){ document.getElementById("demo").style.color="#ff0000";}</script>
    • #5 Pengecekan Input
    • <script>function myFunction(){varx=document.getElementById("demo").value;if(x==""||isNaN(x)) { alert("Not Numeric"); }}</script>
    • <body><h1>My First JavaScript</h1><p>Please input a number.</p><input id="demo" type="text"><button type="button"onclick="myFunction()">Click Me!</button></body>
    • JavaScript TIDAK HARUS diletakkan didalam <head>...</head>
    • bisa di dalam<body>...</body>
    • Atau seperti CSS, di File Lain <script type="text/javascript" src="http://www.dakta.com/wp-content/plugins/audio-player/assets/audio-player.js?ver=2.0.4.1"></script>
    • #4 Document Object Model 1/6
    • document.getElementByID("some id")
    • Standar W3C untuk mengakses elemen HTML
    • ketika sebuah halaman Web diLoad, Browser membuat sebuah Document Object Model (DOM) dari halaman tersebut
    • model HTML DOM dibangundalam bentuk trees dari object.
    • *Tree menggambarkan BEBERAPA contoh Elemen HTML
    • jika ingin memanipulasi elemen HTML, kita harus menemukan elemen HTML-nya terlebih dahulu.
    • jika ingin memanipulasi elemen HTML, kita harus menemukan elemen HTML-nya terlebih dahulu. *Sebagaimana Selector pada CSS
    • 3 cara
    • 3 CaraMenemukan elemen HTML- dengan id- dengan tag- dengan class
    • dengan idvar x=document.getElementById("intro");
    • dengan tagvar x=document.getElementById("main");var y=x.getElementsByTagName("p");
    • #5 Programming Features 1/6
    • Commentvar x=5; /* declare x and assign 5 to it */var y=x+2; // declare y and assign x+2 to it
    • Variablevar x=5;var y=6;var z=x+y;
    • Tipe Datavar x // Now x is undefinedvar x = 5; // Now x is a Numbervar x = "John"; // Now x is a String
    • Objectperson=new Object();person.firstname="John";person.lastname="Doe";person.age=50;person.eyecolor="blue";
    • IF-Elseif (time<20) { x="Good day"; } else { x="Good evening"; }
    • Loopingfor (var i=0;i<cars.length;i++) { document.write(cars[i] + "<br>"); }
    • dan lain lain...
    • Further references :http://www.w3schools.com
    • next session Server Side Programming