Bài giảng Thiết kế web Dreamweaver CS4 - Chapter 10: Document Object Model (DOM)

The Document Object Model is a platform- and language-neutral interface that will allow programs and scripts to dynamically access and update the content, structure and style of documents. In this chapter we will learn with Document Object Model, inviting you to refer.

Document Object Model (DOM) HTML DOM The Document Object Model is a platform- and language-neutral interface that will allow programs and scripts to dynamically access and update the content, structure and style of documents window document event frame history location document form button check box hidden password radio reset select submit text textarea anchor applet class element embeb ID image layer link plug-in style tag navigator screen CREATING OBJECTS Define the function: function ObjectName(List Parameter) { this.property1= Parameter1; this.property2= Parameter2; … this.method1=functionName1; this.method2=functionName2; … } CREATING OBJECTS To call object we use the keyword new Exemple: function myobject() { this.containedValue = 0; this.othercontainedValue = 0; this.anothercontainedValue = 0; } var mything = new myobject(); ARRAY OBJECT Array: An array is a special variable, which can hold more than one value, at a time An array can be defined in three ways: – var myCars=new Array(); myCars[0]="Saab"; myCars[1]="Volvo"; myCars[2]="BMW"; – var myCars=new Array("Saab","Volvo","BMW"); – var myCars=["Saab","Volvo","BMW"]; ARRAY OBJECT Array Object Properties Ex: var fruits = ["Banana", "Orange", "Apple", "Mango"]; document.write("Original length: " + fruits.length); ARRAY OBJECT Array Object Methods DATE OBJECT Date Object: The Date object is used to work with dates and times – Date objects are created with new Date() – There are four ways of instantiating a date: var d = new Date(); var d = new Date(milliseconds); var d = new Date(dateString); var d = new Date(year, month, day, hours, minutes, seconds, milliseconds); csehui.wordpress.com Computer Science & Engineering DATE OBJECT Date Object Methods DATE OBJECT Date Object Methods FORM OBJECT Form Object Properties FORM OBJECT Form elements Collection – The elements collection returns an array containing each element in the form Syntax – formObject.elements[].property FORM OBJECT EX: Firstname: Lastname:

Get the value of all the elements in the form: var x=document.getElementById("myForm"); for (var i=0;i