JavaScript Dom 学习笔记

Carterslam · 发表于 2013-2-7 19:11:52

1.Dom对象的层次关系图

window
| -- location
| -- frames
| -- history
| -- navigator
| -- event
| -- screen
| -- document
         | -- links          | -- location
         | -- images
         | -- anchors
         | -- filters
         | -- forms
         | -- applets
         | -- embeds
         | -- plugins
         | -- frames
         | -- scripts
         | -- all
         | -- selection
         | -- styleSheets
         | -- body

例子：  禁止右键弹出事件
   function hideContextMenu(){
      return window.event.returnValue=false;
   }

<body >
or
<body >

效果一样

============= 2_1.window 对象 ============= window.alert("hello world");
-------------
window.confirm("hello world");
对话框
例子:
if(window.confirm("hello")==true){
alert("yes");
}else{
alert("no");
}
-------------
window.prompt()
可输入值的对话框
例子:
alert(window.prompt("年龄","18"));
-------------
window.navigate()
导航到某url
-------------
window.setInterval()
每隔多久执行一次此方法，执行多次
-------------
window.setTimeout("window.close()",5000) 5秒后关闭
过多久后执行此方法，执行一次
-------------
window.clearInterval()
取消setInterval
-------------
window.clearTimeout()
取消setTimeout
-------------
window.MoveTo()
window.resizeTo()
-------------
window.open()       对应的关闭  window.close()
打开一个新窗口
-------------
window.showModalDialog()
打开模态对话框

============= 2_2.window 对象 frames数组对象 =============
parent的使用主html
<html><frameset rows="20%,80%">  <frame name="top" src="top.html" />  <frame name="bottom" src="bottom.html" /></frameset></html>

top.html
<input type="button" value="刷新"  />或者<input type="button" value="刷新"  />或者<input type="button" value="刷新"  />或者<input type="button" value="刷新"  />或者<input type="button" value="刷新"  />或者<input type="button" value="刷新"  />

top的使用
top.html
<frameset rows="20%,*" > <frame name="a" /> <frame name="x" src="bottom" /> </frameset>

bottom.html
<frameset cols="300%,*" > <frame name="b" /> <frame name="c" src="bottom_right" /> </frameset>

buttom_right.html
<script> top.a.document.write("i love this game"); </script>或者<script> parent.parent.document.write("i love this game"); </script>

============= 2_2.window 对象 event对象 =============
属性：
altKey return boolean
ctrlKey
shiftKey
clientX  返回窗口客户区坐标（不包括边框和滚动条）
clientY
screenX  鼠标相对窗口坐标
scrrenY
offsetX  鼠标相对事件源坐标
offsetY
x       鼠标相对事件源父元素顶点坐标
y
returnValue 设置false，相当于取消操作
cancelBubble 示例讲解：张孝祥JavaScript dom 20：00
srcElement  返回当前事件源对象
keyCode    返回键盘unicode码值
button

============= 2_3.window 对象 .事件 =============
专用事件：
onload() 网页加载事件
onunload()  关闭网页后事件
onbeforeunload()  关闭网页前事件

浏览器是边加载文本内容边执行函数，最后才加载事件:请看以下例子：
<sript> alert("ok1"); <body  >    hello </body> alert("ok2"); alert("ok3"); </script>执行的顺序是  ：  ok1  hello  ok2  ok3  byebye

通用事件：
onclick()
onmousemove()
onmouseover()
onmouseout()
onmousedown()
onmouseup()
onkeydown()
onkeyup()
onkeypress()  按下并弹起后事件

============= 2_3.window 对象 .属性 =============

		自动登录	找回密码
密码			立即注册

JavaScript Dom 学习笔记

浏览过的版块