重学JS—第八章window

159 阅读1分钟

1window对象

1.1全局作用域

定义全局变量,与在window对象上直接定义属性有所不同。全局变量不能通过delete操作符删除,而定义在window对象上的属性可以。

1.2框架frames

  • 每个frame都有自己的window对象
  • 最高层窗口中,通过代码访问每个框架的方式

1.3确定窗口位置

screenLeft

screenTop

(typeof window.screenTop === 'number' ) ? window.screenTop : window.screenY

window.moveTo(x,y)

window.moveBy(x,y)

1.4窗口大小

可视区大小

window.innerWidth

window.innerHeight

浏览器窗口大小

window.outerWidth

window.outerHeight

调整窗口大小

resizeTo(x,y)

resizeBy(x,y)

1.5打开窗口

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<script>
    function changePage() {
        var newWindow = window.open ('https://www.e-hqins.com/', 'newwindow', 'height=100, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=n o, status=no')
        newWindow.resizeTo(window.outerWidth,window.outerHeight)
        setTimeout(()=>{
            newWindow.close()
        },2000)
    }
</script>
<body><button onclick="changePage()">点我</button></body>
</html>

2location对象

  • 提供了当前窗口加载文档的有关信息
  • 提供了一些导航功能
  • 将URL解析成为独立片段

    hash host hostname href pathname port protocol search

获取search,将其返回为数组

2.1位置操作

_assgin _

下述三种方式没有区别

window.location = 'https://www.e-hqins.com'
location.href = 'https://www.e-hqins.com'
location.assign('https://www.e-hqins.com')

    可以通过

location.xxx

_replace _

    对hash、search、hostname、port进行修改

  • 每次修改location属性(hash除外),页面都会以新的URL进行加载
  • 通过修改URL进行加载,会形成历史记录,如果禁用该行为,可以使用replace()方法
  • 使用replace()方法之后,将无法返回前一个页面

reload

location.reload()  // 有可能从缓存中加载
location.reload(true)  // 重新加载

3navigator对象

appCodeName:返回浏览器的代码名。以Netscape代码为基础的浏览器中,它的值是"Mozilla".为兼容Microsoft也是

cookieEnabled:返回指明浏览器中是否启用 cookie 的布尔值

onLine:返回指明系统是否处于脱机模式的布尔值(脱机,就是你电脑是否联网)

platform:浏览器所在的系统平台

4history对象

history.go(number)

history.back()

history.forward()

用户打开的第一个页面history.length是0