[前端学习]jsBOM部分学习笔记,第一天

BOM

  • 全称browser object modle,浏览器对象模型window。它是整个浏览器最顶级的对象
  • 所有定义的全局变量和和全局函数都会自动变成window的属性和方法
  • window对象下的属性和方法,可以不写window,直接写属性名和方法名就能调用。

窗体加载事件

  • window.onload = function(){};浏览器在加载页面时,是从上至下的顺序,依次加载执行。所以之前在练习dom时,为了能准确获取操作到页面中对象节点,我们都是把js代码写在了最后面,目的就先让其他东西加载完毕再加载执行js
  • 而有了window.onload事件后,js代码就可以放在任意地方了。把js代码写在这个方法内部,它会在页面全部加载完毕后,再执行内部的代码,所以即使在顶部也可以正确执行。

打开关闭窗口

  • 通过bom的两个方法可以操作窗口的开关
  • window.open(目标地址,打开方式,新窗口属性) 这个方法可以新打开一个窗口,第一参数就是新窗口网页的地址,第二个参数有_blank_self两个值可以选,分别对应新窗口打开和当前窗口打开。第三个窗口可以设置新打开窗口的属性。
  • window.colse()调用这个方法默认关闭当前窗口,也可获取每个窗口的索引地址赋给变量,然后用变量调用方法,可以关闭对应的窗口。

定时器

  • 延时定时器
    • setTimeout(延时执行的函数,延时时间)设置延时定时器,过了参数时间之后再执行回调函数内部的代码,注意延时时间的单位是毫秒
    • clearTimeout(定时器id)清除延时定时器,如果在延时定时器执行前执行了清除了,那么就不再执行。传入参数是延时定时器的id,在设置时会自动返回id
  • 间歇定时器
    • setInterval(间隙执行的函数,间隙时间)使用方法和延时定时器一样,不过间歇定时器是每隔一段参数时间执行一次,反复执行
    • clearInterval(定时器id)与清除延时定时器用法相同

location对象

  • location相当于是浏览器地址栏,使用它可以跳转地址已经解析地址片段
  • 以下是几个location常用属性的描述
    • location.hash 返回的是地址中锚点
    • location.href 跳转到对应地址
    • location.host 返回主机名和端口
    • location.hostname 返回主机名
    • location.port 返回端口号
    • location.pathName 返回当前地址中的文件路径
    • location.protocal 返回当前地址使用的协议
    • location.search 返回当前地址中的参数

navigator对象

  • navigator.useragent 调用这个属性可以获取用户客户端的信息,比如浏览器信息,系统信息等。
  • 该对象属性有很多,需要去查阅手册,这里不多做记录

history对象

  • history.forward() 相当于浏览器的前进按钮
  • history.back() 相当于浏览器的后腿按钮
  • 该对象属性有很多,需要去查阅手册,这里不多做记录

screen对象

  • screen.width 获取屏幕宽度
  • screen.height获取屏幕高度
  • screen.availWidth 获取浏览器可用的屏幕宽度
  • screen.availHeight 获取浏览器可用的屏幕高度

date对象

  • var date = new Date(2017,10,9|2017-10-9|时间戳); 使用这个构造函数可以创建日期对象,获取当前的日期和时间,谷歌浏览器会自动把它转换为字符串的格式。如果创建对象时写入了参数,那么就不再获取当前时间,而是根据传入的时间来创建对象,参数可以有三种形式。
  • 把日期转换为unix时间戳的方法:
    • 日期对象.valueOf() 用对象调用valueOf方法
    • Date.now() 直接用构造函数调用now()方法
    • var date= +new Date(); 创建对象时使用正号,隐式的转换为数字
  • 日期的格式化转换
    • 日期对象.toDateString() 显示当前日期的字符串
    • 日期对象.toTimeString() 显示当前时间的字符串
    • 日期对象.toLocalDateSrting() 显示当前日期并格式化为当地习惯的格式(2017/10/9)
    • 日期对象.toLocalTimeSrting() 显示当前时间并格式化为当地习惯的格式(16:51:00)
  • 获取日期对象中指定的部分
    • 日期对象.getTime() 也是把对象转为unix时间戳
    • 日期对象.getMilliseconds() 返回当前对象时间戳格式中的毫秒部分
    • 日期对象.getSeconds() 返回秒部分0-59
    • 日期对象.getMinutes() 返回分钟部分0-59
    • 日期对象.getHours() 返回小时部分0-23
    • 日期对象.getDays() 返回星期几0-6
    • 日期对象.getDate() 返回是当前月的第几天
    • 日期对象.getMonth() 返回当前月份0-11
    • 日期对象.getFullYear() 返回4位数的年份

你可能感兴趣的:([前端学习]jsBOM部分学习笔记,第一天)