1. 输出 document.write(" ");
2. 变量 var
3. DOM简介
网页在加载时, 浏览器会创建页面的文档对象模型(Document Object Model)
添加监听器 document.getElementById("xx").addEventListener() 此方法一个元素添加多个事件不会冲突！
4. 事件流
事件流：描述页面中接受事件的顺序
事件冒泡：最具体的元素接收, 逐级向上传播至最不具体的元素节点
事件捕获：最不具体的节点先接收事件, 最具体的节点最后接受事件
eg. <div id="div"><button id="btn">按钮</button></div>
事件冒泡：点击按钮之后先是button接收事件, 再是div
eg. document.getElementById("xx").onclick = function(){ xxxx };
5. 事件对象
事件对象 event.xxx:
<1> type 事件类型
<2> target 事件目标
<3> stopPropagation 阻止事件冒泡
<4> preventDefault 阻止事件默认行为
6. JS内置对象
indexof() 存在则返回第几位, 不存在返回-1
match() 内容匹配则返回内容, 不匹配返回null
replace("a","b") 将a替换为b
toUpperCase() / toLowerCase()
...
Date() Array() Math()等
7. JS浏览器对象
<1>window对象 window.innerHeight()/.innerWidth 浏览器内部窗口的高/宽度(除去了菜单栏之类的)
<2>计时器对象 setInterval()/clearInterval() 间隔一段时间不停做某事
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <p id="pTime"></p> <script> var timer = setInterval(function(){
var date = new Date;
document.getElementById("pTime").innerHTML = date.toLocaleString();
},1000);
//关闭计时器 clearInterval(timer); </script> </body> </html>
setTimeout(function(){ xxxx }, 时间)/clearTimeOut 延迟多久后做一次某事
8. History对象
包含浏览器的历史url集合
history.back / history.forward / history.go(进入历史的某个页面)
9. Location对象
获得当前页面url, 并把浏览器重定向到新的页面
location.hostname 主机域名
location.pathname 当前页面路径和文件名
location.port 主机端口
location.protocol web协议(http或https)
location.href 当前页面href
location.assign 加载新文档
10. Screen对象
screen.availWidth/.availHeight 可用的屏幕宽度/高度
screen.Height/.Width 屏幕高度/宽度