JavaScript DOM Objects 1

1
JavaScript DOM Objects (1)
2
JavaScript DOM Objects

• DOM Document Object Model
• Browser Object Model (BOM)
• window, screen, navigator, history, location
• DHTML DOM
• document, form, anchor, link, image,
• W3C DOM
• element, node,

3
screen
navigator
window
location
history
document
anchors
links
images
event
forms


input
select

textarea
option
button
4
screen
5
1440
1290
1269
705
870
900
6
navigator
7
window
8
window's methods (1/2)
9
window's methods (2/2)
10
Dialog Boxes

• alert("Welcome to !")
• if (confirm("Are you sure to ?"))
• // Yes, do something
• else
• // No, do nothing, or other things
• var nname prompt("Welcome!\nPlease give a nick
  name", "fred")

http//www.im.ncnu.edu.tw/ycchen/www/js/dialog.ht
ml
11
window.open( )

• window.open(URL, name, features, replace)
• var wwindow.open(URL, name, features, replace)
• // w.close()
• URL ??,??
• name ??,window??
• features ????????????, ??
• "width300, height200, scrollbars, location"
• scrollbars, status, toolbar, location, menubar,
  directories, resizable,
• width, height, top, left
• replace true ?false
• URL????history list??????

12

• var strf "width600, height400, scrollbars,
  location"
• window.open("http//www.im.ncnu.edu.tw/", "NCNU",
  strf)

13
setInterval(), clearInterval()

• var int
• window.onload function()
• intwindow.setInterval("clock()", 100)
• function clock( )
• var tnew Date()
• var hh t.getHours( ) var mm
  t.getMinutes( ) var ss t.getSeconds( )
• hh (hhlt10) ? "0"hh hh
• mm (mmlt10) ? "0"mm mm
• ss (sslt10) ? "0"ss ss
• document.getElementById("clock").innerHTMLhh
  ""mm""ss
• window.clearInterval(int)

14
history

• Properties
• length
• Methods
• back()
• forward()
• go(number)

window.history.back() window.history.forward() w
indow.history.go(-1)
15
location
16
location's methods
window.location.assign("http//www.php.net/") win
dow.location.reload() window.location.replace("ht
tp//www.php.net/")