JavaScript---Bom树的操作,内置方法和内置对象(window对象,location对象,navigator对象,history对象,screen对象)

JavaScript---Bom树的操作,内置方法和内置对象(window对象,location对象,navigator对象,history对象,screen对象)

一丶什么是BOM

???????Bom:Browser Object Model,浏览器对象模型.操作浏览器部分的功能的API(事件/函数).

结构图:

???分析:1.window对象是Bom的顶层对象.所有的对象都是从windom延伸出来的,称其为window子对象.

?????? 2.dom是bom的一部分

?????? 3.全局变量 , 自定义函数也是window对象的属性和方法

?????? 4.window对象下的属性和方法调用时,可以省略window

二丶Bom常见的内置方法和内置对象

Window对象

??????操作浏览器窗口的一些方法:如弹框,窗口宽高

/* 弹出系统对话框 */
     alert();   //显示对话框
     confirm(); //确认对话框
     prompt();  //输入对话框

/* 打开窗口,关闭窗口 */
    //打开
    window.open(url,target); //url:链接地址,target:新窗口的位置
    //关闭
    window.close(); // 只关闭js开启的窗口

/* 获得窗口的宽高 */
    window.innerHeight;  //获得浏览器窗口的高度
    window.innerWidth;  //获得浏览器窗口的宽度

/* 定时器 */
    // setTimeOut(fn,n), n毫秒 之后只执行一次 fn函数/操作
            function add(){
                alert('hellow');
            }

            var t1=windom.setTimeOut(add,1000);  //直接跟函数名
            var t2=windom.setTimeOut('add()',1000);  //直接跟函数名+()

            // 额外方式:
            setTimeOut(function (){
                    alert('你好');
                },3000); 

           window.clearTimeout(t1); //去除定时器

    // setInterval(fn,n),指定周期, n毫秒之后,循环执行此 fn函数/操作
                function add(){
                     alert('hellow');
                }

            var I1=windom.setInterval(add,1000);  //直接跟函数名
            var I2=windom.setInterval('add()',1000);  //直接跟函数名+()

           window.clearInterval(I1); //去除定时器

location对象

??????获得浏览器URL的信息

/* location对象的属性 */
    //href :跳转
        location.href;  //当前链接地址
        location.href='url';  //跳转到url连接

    //hash :返回url后面 #号后面的内容,包含#号
        location.hash  //  "#/dj"

    //host : 主机名和端口
        location.host     //"localhost:63342"

    //hostname : 主机名
        location.hostname  //'localhost'

    //pathname : url的路径
        localtion.pathname // "/03%20location%E5%AF%B9%E8%B1%A1%E5%B1%9E%E6%80%A7.html"

    //protocol : 协议,一般是http,https(加密传输,需要有许可证)
        location.protocol

    //search : 查询?后面的字符串
        location.search  //"?_ijt=hqted3fmhsv2rhog47ro1mncq0"

    //reload() :重新加载
        window.location.reload();

navigator对象

??????获取客户端的一些信息

/* userAgent:系统信息,客户端信息  */
    navigator.userAgent

/* platform 浏览器支持的系统  */
    navigator.platform

history对象

?

/* 后退和前进 */
    history.back()  //后退
    history.forward() //前进
    history.go(-1)  // 0是刷新 , 1是前进 , -1是后退

screen对象(了解即可)

???????屏幕对象

screen.availWidth // 可用的屏幕宽度
screen.availHeight // 可用的屏幕高度

原文地址:https://www.cnblogs.com/dengl/p/11355195.html

时间: 2024-10-12 12:02:15

JavaScript---Bom树的操作,内置方法和内置对象(window对象,location对象,navigator对象,history对象,screen对象)的相关文章

Javascript进阶篇——浏览器对象—Location、Navigator、userAgent、screen对象

Location对象location用于获取或设置窗体的URL,并且可以用于解析URL.语法: location.[属性|方法] location对象属性图示: location 对象属性: location 对象方法: 获取当前显示文档的URL,并输出: 1 <script type="text/javascript"> 2 var a = location.href; 3 document.write(a); 4 </script> Navigator对象

BOM之navigator、history、screen对象

navigator对象 [定义] navigator已经成为识别客户端浏览器的事实标准.下表中列出存在于所有浏览器的属性和方法 console.log(window.navigator.userAgent) //chrome:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.93 Safari/537.36 //firefox:Mozilla/5.0 (Windo

JavaScript基础:BOM的常见内置方法和内置对象

本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. BOM的介绍 JavaScript的组成 JavaScript基础分为三个部分: ECMAScript:JavaScript的语法标准.包括变量.表达式.运算符.函数.if语句.for语句等. DOM:文档对象模型,操作网页上的元素的API.比如让盒子移动.变色.轮播图等. BOM:浏览器对象模型,操作浏览器部分功能的API.比如让浏览器自动滚动. 什么是BOM BOM

【Python】Java程序员学习Python(四)— 内置方法和内置变量

<假如爱有天意> 当天边那颗星出现,你可知我又开始想念,有多少爱恋只能遥遥相望,就像月光洒向海面,年少的我们曾以为,相爱的人就能到永远,当我们相信情到深处在一起,听不见风中的叹息,谁知道爱是什么,短暂的相遇却念念不忘,用尽一生的时间,竟学不会遗忘,如今我们已天各一方,生活的像周围人一样,眼前人给我最信任的依赖,但愿你被温柔对待,多少恍惚的时候,仿佛看见你在人海川流,隐约中你已浮现,一转眼又不见,短暂的相遇却念念不忘,多少恍惚的时候,仿佛看见你在人海川流,隐约中你已浮现,一转眼又不见,当天边那颗

JavaScript 计时器,History 对象(window),Location对象(window),Navigator对象

1,计时器setInterval()  在执行时,从载入页面后每隔指定的时间执行代码. setInterval(代码,交互时间); 2,计时器setTimeout(),在载入后延迟指定时间后,去执行一次表达式,仅执行一次. 递归,就是在运行的过程中调用自己.setTimeout()计时器,在载入后延迟指定时间后,去执行一次表达式,仅执行一次. setTimeout(代码,延迟时间); function startCount() { document.getElementById('count')

Python进阶之浅谈内置方法

目录 有序or无序和可变or不可变 数字类型内置方法 整形 浮点型 字符串类型内置方法 有序or无序和可变or不可变 有序:有索引 无序:无索引 可变:变量值变,id不变 不可变:变量值变,id也变 数字类型内置方法 整形 1.作用 描述年龄,id,身高 2.定义方式 x=10 x=int('10') 3.内置方法 没有内置方法,只有算术运算和比较运算 4.存在一个值还是多个值 一个值 5.有序or无序 整形没有这一说法 6.可变or不可变 整形是不可变的 浮点型 1.作用 描述薪资等 2.定义

Python:数字类型和字符串类型的内置方法

一.数字类型内置方法 1.1 整型的内置方法 作用 描述年龄.号码.id号 定义方式 x = 10 x = int('10') x = int(10.1) x = int('10.1') # 报错 内置方法 没有内置方法,只有算术运算和比较运算 存在一个值还是多个值 存一个值 有序or无序 有序:有索引:无序:无索引 压根就没有这一说 可变or不可变(重点) 数字类型不可变 可变(变量值而言) lis = [1,2,3] print(id(lis)) lis[0] = 2 #lis-->[2,2

JS基础--函数与BOM、DOM操作、JS中的事件以及内置对象

   前   言 絮叨絮叨 这里是JS基础知识集中讲解的第三篇,也是最后一篇,三篇JS的基础,大多是知识的罗列,并没有涉及更难得东西,干货满满!看完这一篇后,相信许多正在像我一样正处于初级阶段的同学,经过初步的学习,会对这一门语言有了一定深入的了解,也会感受到这一门语言的强大之处.希望各位同学通过一定的学习,会得到等大的收获. 因为是最后一篇所以内容可能有点多,希望各位同学能够慢慢看,细细看,让我们一起学习,一起进步,一起感受JS的魅力. 一函数 函数的声明及调用 1.函数的声明格式: func

js-DOM ~ 04. BOM:浏览器对象模型window. 、定时器、在线用户、祝愿墙、BOM的内置方法内置对象

multiple. select列表多选 触发事件后调用有参数的函数要先创建一个函数,然后在函数内调用执行函数 Array.from(伪数组):伪数组变为真数组 indexOf():查询字符的索引 a)  indexOf('abcde') i.      indexOf('a')的索引是0 ii.      indexOf('abc')的索引是0,按照第一个字符的索引 iii.      indexOf('ac')的索引是-1,查找不到ac连续的字符 iv.      indexOf('f')的