รูปภาพจาก https://jresponse.net/
สวัสดีครับเมื่อบทความก่อนหน้านี้ได้รู้จักกับการพัฒนา Web Application ด้วย Java กันแล้วซึ่งทำงานอยู่ฝั่ง Server ในบทความนี้เราจะมาดูภาษาที่ทำงานฝั่ง Client กันบ้างนะครับสำหรับฝั่ง Client ที่ใช้พัฒนา Web Application หลักๆจะมีอยู่ 3 ภาษาที่ใช้กันนะครับนั่นคือ
1. HTML เพื่อกำหนดเนื้อหาต่างๆของหน้าเว็บ
2. CSS เพื่อระบุรูปแบบของหน้าเว็บหรือตกแต่งหน้าเว็บนั่นเอง
3. JavaScript ใช้ในการเขียนโปรแกรมการทำงานของหน้าเว็บ
3 ภาษาข้างบนที่กล่าวมานั้นจะใช้ทำงานร่วมกันนะครับซึ่งในบทความนี้เราจะพูดถึง javascript กันครับ Javascript เป็นภาษา script ที่ใช้ร่วมกับหน้า html ที่เป็น tag javascript จึงต้องเขียนภายใน tag javascript ครับ มาดูการใช้งาน java script กันครับ
Tag ของ Javascript
<script type="text/javascript">
.....
</script>
การประกาศตัวแปลใน Javascript จะใช้ var ขึ้นต้นทุกชนิดของข้อมูล เช่นถ้าอยากให้ตัวแปลเป็น String ก็ประกาศ var name = "chinja"; ถ้าอยากให้ตัวแปลเป็น number ก็ประกาศเป็น var old = 25; เป็นต้น
การใช้ function javascript เราสามารถนำคำสั่งต่างๆใส่ลงใน function เป็นชุดคำสั่งเพื่อที่จะเรียกใช้งานได้สะดวกขึ้นเพราะเป็นชุดคำสั่งไป เช่น
<script type="text/javascript">
function alertData(){
var name = "chinja";
var old = 25;
alert(name+","+old);
}
</script>
วิธีการ call function javascript ถ้าอยากเรียกใช้ function ตรง event ใดก็พิมพ์แบบนี้ได้เลย alertData(); เมื่อ call function ดังกล่างก็จะได้ผลลัพธ์ดังนี้
ในหน้าเว็บต่างๆจะมี content อยู่มากมายถ้าเราต้องการเปลี่ยน content บนหน้าเว็บโดยใช้ Javascript ก็สามารถใช้คำสั่งนี้ได้
<html>
<body>
<p id="demo">Hello World</p>
<button type="button" onclick="changeContent()">กดปุ่มนี้</button>
<script type="text/javascript">
function changeContent(){
document.getElementById("demo").innerHTML = "Hello changed.";
}
</script>
</body>
</html>
ตัวอย่างด้านบนนี้คือเมื่อกดปุ่มจะเปลี่ยนข้อความบนหน้าเว็บจาก "Hello World" เป็น "Hello Changed."
นอกจากคำสั่งพื้นฐานแล้ว JS ยังทำอะไรได้อีกมากมายไม่ว่าจะเป็นการคำนวน การเก็บข้อมูลเป็น array,object การส่งข้อมูลไปยังฝั่ง Server แบบ Ajax json การเปลี่ยนแปลง attribute ต่างๆใน tag html
นอกจากนี้ javascript ยังมี framework มากมายให้เลือกใช้และเพิ่มความสามารถมากขึ้น เช่น jquery,dojo,sencha เป็นต้น
ไม่มีความคิดเห็น:
แสดงความคิดเห็น