首页 > 编程语言 >Javascript进阶笔记 - BOM

Javascript进阶笔记 - BOM

时间:2022-11-02 05:11:26浏览次数:45  
标签:Javascript 进阶 对象 游览器 定时器 BOM 跳转 页面

6. BOM

目录

1. BOM简介

  • BOM是指游览器对象模型,BOM提供了一组对象,方便用户通过JS操作游览器

  • BOM对象

    • Window

      • 代表整个游览器的窗口,同时也是网页中的全局对象
    • Navigator

      • 代表当前游览器的信息,通过该对象可以识别不同的游览器(大多数已失效)
    • Location

      • 代表当前游览器的地址栏信息,通过Location可以获取地址栏信息,或者操作游览器跳转页面
    • History

      • 代表游览器的历史记录,可以通过该对象来操作游览器的历史记录

        由于隐私原因,该对象不能具体获取到具体的历史记录,只能操作游览器向前或向后翻页

        该操作只在当次访问时有效

    • Screen

      • 代表用户的屏幕信息,通过该对象可以获取用户的显示器相关信息

2. History

  • 该对象可以用来操作游览器向前或向后翻页
  • 常用属性与方法
    • length:获取当前访问的链接数量
    • back():可以回退到上一个页面,作用和游览器的回退按钮一样
    • forward():可以跳转到下一个页面,作用和游览器的前进按钮一样
    • go():可以跳转到指定的页面
      • 当数值为+x时,表示向前跳转x个页面
      • 当数值为-x时,表示向后跳转x个页面

3. Location

  • 该对象可以获取当前游览器的地址栏信息

  • 常用属性与方法

    • 直接输出location可以获取到当前页面的完整路径

      如果直接将location属性修改为一个完整的路径,则页面会自动跳转到该路径并生成对应的历史记录

    • reload():用于重新加载当前页面,作用和刷新按钮一样。如果在参数中传递一个true,则会强制清空缓存刷新页面

    • replace():使用一个新的页面替换当前页面,调用完毕也会跳转页面,但不会生成历史记录,无法用回退按钮回退

4. 定时器

  • setInterval()

    • 定时调用函数,可以将一个函数每隔一段时间执行一次。返回一个Number类型的值,用来作为定时器的唯一标识
    • 语法:setInterval([回调函数],[间隔时间])
  • clearInterval()

    • 可以用来关闭一个定时器,方法中需要一个标识作为参数,将关闭标识对应的定时器
    var num = 1;
    var timer = setInterval(function(){
        count.innerHTML = num++;
        if(num == 11){
            clearInterval(timer);
        }
    },1000);
    
  • setTimeout()

    • 延时调用一个函数,隔一段时间后执行,且只执行一次
  • clearTimeout()

    • 关闭延时调用函数
    var timer = setTimeout(function(){
        console.log(num++);
    },3000);
    clearTimeout(timer);
    

标签:Javascript,进阶,对象,游览器,定时器,BOM,跳转,页面
From: https://www.cnblogs.com/Solitary-Rhyme/p/16849751.html

相关文章

  • Javascript进阶笔记 - 事件
    事件目录事件1.事件相关概念2.文档的加载3.事件的冒泡4.事件的委派5.事件监听绑定1.事件相关概念事件是电脑输入设备与页面进行交互的响应。注册就是告诉游......
  • Javascript进阶笔记 - 常用事件
    常用事件目录常用事件1.onload事件2.onclick事件3.onblur事件4.onchange事件5.onsubmit事件6.onscroll事件7.onmousemove事件8.onmousedown&onmouseup事件9.on......
  • Javascript进阶笔记 - DOM模型与节点
    DOM模型与节点目录DOM模型与节点1.DOM模型2.节点2.1节点的常用方法1.DOM模型DOM(文档对象模型)就是把文档中的标签,属性,文本转换成对象来管理(类似于Java中的对象)do......
  • Javascript进阶笔记 - DOM的增删改查
    DOM的增删改查目录DOM的增删改查1.DOM查询1.1常规DOM查询方法1.2通过CSS选择器查找HTML元素1.3通过HTML对象选择器查找HTML对象2.DOM元素的增添3.DOM元素的修改......
  • Javascript进阶笔记 - DOM操作CSS样式
    DOM操作CSS样式目录DOM操作CSS样式1.操作样式2.获取当前样式3.其它样式相关属性1.操作样式可以通过JS修改元素的内联样式语法:元素.style.样式名=样式值注意:......
  • JavaScript笔记 - 字符串常用方法
    字符串目录字符串1.字符串搜索indexOf()search()match()includes()startsWith()2.字符串提取slice()substring()substr()charAt()charCodeAt()split()3.字符串替换repl......
  • Javascript笔记 - JS中的数字
    数字目录数字1.精度2.数字方法3.把变量转换为数值1.精度整数在不使用指数或科学计数法的情况下,会被精确到15位varx=999999999999999;//x将是9999999999......
  • JavaScript笔记 - 正则表达式
    正则表达式目录正则表达式1.正则表达式语法1.1方括号1.2量词1.3元字符2.RegExp对象属性3.RegExp对象方法4.支持正则表达式的String对象的方法1.正则表达式语法......
  • javascript异步编程之generator(生成器函数)与asnyc/await语法糖
    Generator异步方案相比于传统回调函数的方式处理异步调用,​​Promise​​最大的优势就是可以链式调用解决回调嵌套的问题。但是这样写依然会有大量的回调函数,虽然他们之间......
  • javascript异步编程之generator(生成器函数)与asnyc/await语法糖
    Generator异步方案相比于传统回调函数的方式处理异步调用,Promise最大的优势就是可以链式调用解决回调嵌套的问题。但是这样写依然会有大量的回调函数,虽然他们之间没有嵌......