โครงสร้างพื้นฐานของ JavaScript องค์ประกอบพื้นฐานที่สำคัญมีดังนี้ Variable and Value Operator Statement Function Event and Event handler Object
Object ใน JavaScript Window Objects HTML Objects หรือ Document Object Built-in Objects User Define Objects
Document Object รูปแบบการเขียน Document.[xxxxxxx] Properties Method รูปแบบของหน้าเอกสารเว็บเพจ เช่น พื้นหลัง สีของอักษร สีลิงค์ ข้อความไตเติ้ล คำสั่งที่เกี่ยวกับเอกสาร ที่สามารถเรียกใช้ได้ เช่น แสดงข้อความ ปิดเอกสาร
Document Object Properties document.bgcolor = red document.fgcolor = black document.linkcolor = blue document.alinkcolor = blue document.vlinkcolor = cyan document.location = เก็บ URL ของเว็บเพจปัจจุบัน document.form = เก็บฟอร์มอ๊อบเจ็กต์ document.images = เก็บชื่อรูปภาพที่ใช้ในเว็บหน้าปัจจุบันเป็นลำดับ ๆ document.links = เก็บลิงค์เอาไว้เป็นลำดับ ๆ
Document Object Methods document.clear() document.close() document.write(“hello”) document.writeln(“bye”)
Document Object Model โครงสร้างของ Object จะเป็นลำดับชั้นสามารถเรียกใช้อย่างเป็นลำดับได้เพื่อเรียก element แต่ละตัวใน HTML สิ่งที่ต้องทำก็แค่กำหนดชื่อให้กับ element ต่างๆ ใน HTML tag เช่น : Forms, fields, images, etc. JavaScript มีการกำหนด objects บางตัวไว้อัตโนมัติ (ไม่ต้องมากำหนดใหม่) สามารถเรียกใช้งานได้เลย เช่น document navigator screen window
The Document Object ส่วนประกอบต่างๆใน document object: Title Referrer URL Images Forms Links Colors
Objects Objects มี attributes และ methods objectname.attributename objectname.methodname()
document methods document.write() สั่งให้เขียนหรือแสดงข้อความที่ document เช่น document.write("My title is" + document.title); <HEAD> <TITLE>JavaScript is Javalicious</TITLE> </HEAD> <BODY> <H3>I am a web page and here is my name:</H3> <SCRIPT> document.write(document.title); </SCRIPT> <HR>
DOM example <FORM ID=myform ACTION=… Please Enter Your Age: <INPUT TYPE=TEXT ID=age NAME=age><BR> And your weight: <INPUT TYPE=TEXT ID=weight NAME=weight><BR> </FORM> ถ้าต้องการเรียกค่าที่ได้จาก textbox ชื่อ age ออกมาใช้เราสามารถใช้ document.myform.age.value