Download presentation
Presentation is loading. Please wait.
1
Document Object Model
2
Our scripts will be added to a page. Document Object Model
3
Both are Documents
4
Arrays are Objects Dates etc
In simple word individual pieces of information in a page will be an object.
6
Set of terms that we agree on
7
That discribe exactly how to interact with
So what do we agree upon That discribe exactly how to interact with
13
So how do we use JavaScript to Grab/hold one of these Nodes/Elements
Needs to be Unique So how do we use JavaScript to Grab/hold one of these Nodes/Elements
14
And if the Element that you are after and it has that unique ID
Grab it in JavaScript Using one of the most Imp Method of Document Object that is And if the Element that you are after and it has that unique ID
15
getElementById <html> <head> <title>getElementById example</title> <script> function changeColor(newColor) { var elem = document.getElementById("para1"); elem.style.color = newColor; } </script> </head> <body> <h1 id="para1">Some text here</h1> <form> <input type="button" onClick="changeColor('blue');" value="Turn to Blue"> <input type="button" onClick="changeColor('red');" value="Turn to Red"></form> </body> </html>
16
Remember that is case sensitive
18
What if I don’t have an ID on the Element Or I want is more than one element.
20
Makes an Array
22
TextBox Color function changecolor() { var rang=document.getElementById("mycolor2"). rang.style.backgroundColor='red'; }
Similar presentations
![Working with Forms. how are forms manipulated? the document object contains an array of forms objects, one for each form, in document order –forms[] any.](/3/783151/big_thumb.jpg "Working with Forms. how are forms manipulated? the document object contains an array of forms objects, one for each form, in document order –forms[] any.>")
![JavaScript onLoad getElement. onload Using JavaScript to create content No user input Comes up when page LOADS [redo Koozebane; random picture]](/18/6079660/big_thumb.jpg "JavaScript onLoad getElement. onload Using JavaScript to create content No user input Comes up when page LOADS [redo Koozebane; random picture]>")
