- Window对象
- 计时器
- History对象
- Location对象
- Screen 对象
- Navigator对象
- 弹出窗口
- Cookies
Window对象
innerHeight，innerWidth是不包含滚动条的
window.png
新建窗口与关闭窗口
<body>
<button id="btn" onclick="btnClick()">按钮</button>
<script>
// document.write("宽度" +window.innerWidth+"高度"+window.innerHeight);
function btnClick() {
window.open("new.html","newWindow","height=200px,width = 200px,top =100px,left =100px");
// window.close();
}
</script>
计时器
计时事件.png
以获取当前时间为例，以及停止刷新时间
<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>
<button id="btn" onclick="myWin()">按钮</button>
var win;
function myWin() {
//延迟执行 自己调用自己
win = setTimeout(function () {
alert("hello");
},3000);
}
function stopWin() {
clearTimeout(win);
}
History对象
history.png
一个简单的例子，new 页面中有个按钮:代码如下：
<button id="btn" onclick="goceshi()">按钮</button>
<script>
function goceshi() {
history.back();//回退
}
</script>
ceshi 页面有个链接可以链接到new 页面，有个按钮绑定向前的方法
<a href="new.html">跳转到newhtml</a>
<button id="btn" onclick="gotonew()">按钮</button>
<script>
function gotonew() {
history.forward();
}
</script>
效果图：
向前向后.gif
history.go的用法，回到前一个页面为-1，前往下一个页面为1；同样是两个页面，一个页面按钮显示前往登陆页面，登陆页面中输入框输入后，点击登陆校验密码，正确后回到之前的页面。
<a href="new.html">前往登陆页面</a>
<form>
<input type="text" id="username" placeholder="请输入密码">
</form>
<button id="btn" onclick="safe()">登陆</button>
<script>
function safe() {
var name = document.getElementById("username").value;
if (name =="1"){
history.back();
}else {
alert("输入错误");
}
}
</script>
location对象
location.png
<button id="btn" onclick="getloc()">按钮</button>
<p id="ptime"></p>
<script>
function getloc() {
//返回当前window下正在加载的url
document.getElementById("ptime").innerHTML = window.location.href;
//重新定义页面
location.assign("http://www.app-echo.com");
}
</script>
Screen对象
screen.png
<button id="btn" onclick="getloc()">按钮</button>
<p id="ptime"></p>
<script>
function getloc() {
//返回当前window下正在加载的url
document.getElementById("ptime").innerHTML = window.location.href;
//重新定义页面
location.assign("http://www.app-echo.com");
}
</script>
