事件对象(Event)
在触发DOM事件的时候会产生一个对象
1.type: 获取事件类型
2.target: 获取时间目标
3.stopPropagation(): 阻止事件冒泡
4.preventDefault(): 阻止事件默认行为
<div id="div">
<button id="btn1" onclick="demo()">按钮</button>
</div>
<script>
document.getElementById("btn1").addEventListener("click",showType);
document.getElementById("div").addEventListener("click",showDiv);
function showType(event){
//alert(event.type);
alert(event.target);
event.stopPropagation();//阻止事件冒泡
}
function showDiv(){
alert("div");
}
</script>
浏览器对象#
1.window对象######
window.innerWidth 浏览器窗口的内部宽度 不包含进度条
window.innerHeight 浏览器窗口的内部高度 不包含工具栏
window.open() 打开新窗口
window.open("index.html","标题","大小");
window.close() 关闭当前窗口
2.计时器
方法：
setInterval()间隔指定的毫秒数不停地执行指定的代码
clearInterval()用于停止setInterval()方法执行的函数代码
<button id="btn" onclick="stopTime()">按钮</button>
<p id="ptime"></p>
<script>
var myTime = setInterval(function(){
getTime();
},1000);
function getTime(){
var d = new Date();
var t = d.toLocaleTimeString();
document.getElementById("ptime").innerHTML = t;
}
function stopTime(){
clearInterval(myTime);
}
</script>
setTimeout()暂停指定的毫秒数后执行的代码
clearTimeout()用于停止执行setTimeout()方法的函数代码
3.History对象
window.history 对象包含浏览器的历史(url)的集合
方法：
history.back() 与在浏览器点击后退按钮相同
history.forward() 与在浏览器中点击向前按钮相同
history.go() 进入历史中的某个页面
EXP:
<button id="btn" onclick="goceshi()">按钮</button>
<script>
function goceshi(){
history.back();
}
</script>
4.Location对象######
window.location 对象用于获得当前页面的地址(url),并把浏览器重定向到新的页面
对象属性：
location.hostname 返回web主机的域名
location.pathname 返回当前页面的路径和文件名
location.port 返回web主机的端口
location.protocol 返回所使用的web协议(http://或https://)
location.href 返回当前页面的URL
location.assign() 加载新的文档
window.location.hostname;
location.assign(url);
5.Screen对象
window.screen 对象包含有关用户屏幕的信息
属性：
screen.availWidth 可用的屏幕宽度
screen.availHeight 可用的屏幕高度
screen.Height 屏幕高度
screen.Width 屏幕宽度
<script>
document.write("可用高度:"+screen.availHeight+",可用宽度:"+screen.availWidth);
document.write("高度:"+screen.height+",宽度:"+screen.width);
</script>
