JavaScript基础07——BOM
BOM概念
window对象介绍,内置对象(location/history/navigator)及方法:
// 什么是window对象,window对象是浏览器内置的一个对象,相当于BOM的一个抽象 // window对象是js中全局对象的寄存地。 window对象的常见方法:
alert(要显示的文本); //弹出信息框
prompt(提示对话框信息); //弹出输入框,点击确定,返回字符串,点击取消,返回null
confirm(提示文字); //点击确定返回true,点击取消返回false close(); //关闭浏览器(火狐不支持!),但都支持通过别的网页打开的新的网页关闭
//不允许关闭非脚本打开的页面 open(url,name,feature,replace);
//open('http://www.baidu.com','_blank','width=300,height=300')
//谷歌会默认把系统自动打开的新网页阻止掉,但不阻止通过事件打开的网页
window对象下内置的子对象:
1.history对象:该对象包含浏览器访问过的url。
// 该对象的属性:
history.length; //返回历史记录的数量
// 该对象的方法:
history.back(); //后退,加载前一个url。
history.forward(); //前进,需要后退一下之后,才有前进的方向
history.go(num); //参数为正,前进相应的数目,为负,后退相应的数目,为0,刷新
2.location对象:包含当前url的相关信息,而history对象不能具体反映url的相关信息。
// 该对象的属性:
location.href; //设置或返回完整的url
location.search; //返回url?后面的查询部分
location.hash; //是一个可读写的字符串,是url的锚部分(从#开始的部分)哈希
// 该对象的方法:
location.reload(); //刷新页面的方法,一般情况下,传递一个true,不使用缓存刷新。缓存?
location.assign(url); //加载新页面,当url为空字符时,加载当前页面
3.navigator对象:浏览器信息
navigator.appName; //返回当前浏览器名
navigator.appCodeName; //返回当前浏览器的代码名
navigator.appVersion; //返回当前浏览器的版本号和平台
navigator.platform; //返回当前计算机的操作系统 以上方法已经在逐渐被抛弃,出现一个新的属性替代这些属性:
navigator.userAgent; //返回浏览器信息
几乎没什么卵用
4.frames对象:包含当前页面所有的框架信息。
frames.length; //返回当前页面的框架数量
frames[0].location; //修改第一个框架的地址
5.screen对象:包含当前显示屏信息
screen.width/height //屏幕总宽高度
screen.availWidth/availHeight //屏幕的宽高(不包括任务栏)
window.onload / onscroll/onresize 事件
// onload当文档加载完成后执行一些操作
window.onload = function(){
console.log("页面加载完成")
} // onscroll当页面发生滚动时执行一些操作
window.onload = function(){
console.log(1) //当页面发生滚动时,打印1
} // onresize当窗口大小发生改变时执行一些操作
window.onresize = function(){
console.log(1) //当窗口大小发生改变时,打印1
}
// 页面滚动条距离顶部的距离
document.documentElement.scrollTop
// 页面滚动条距离左边的距离
document.documentElement.scrollLeft
JavaScript基础07——BOM的更多相关文章
- javascript基础07
javascript基础07 1.节点 元素.childNodes : 属性 只读 属性 子节点列表集合 元素.childNodes 只包含子节点,不包含孙节点 DOM节点的类型有很多种,w3c标准有 ...
- JavaScript基础:BOM的常见内置方法和内置对象
本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. BOM的介绍 JavaScript的组成 JavaScript基础分为三 ...
- JavaScript 基础知识 - BOM篇
前言 本篇文章是JavaScript基础知识的BOM篇,如果前面的<JavaScript基础知识-DOM篇>看完了,现在就可以学习BOM了. 注意: 所有的案例都在这里链接: 提取密码密码 ...
- javascript基础:bom
一.BOM 1.概念:Browser Object Model 浏览器对象模型 * 将浏览器的各个组成部分封装成对象 2.组成: * Window:窗口对象 1 ...
- JavaScript基础入门07
目录 JavaScript 基础入门07 BOM window对象 Navigator对象 Screen 对象 Location对象 History 对象 JavaScript 基础入门07 BOM ...
- Javascript基础五(BOM和DOM)
1.BOM概念 什么是BOM? BOM是Browser Object Model的缩写,简称浏览器对象模型.这个对象就是window BOM提供了独立于内容而与浏览器窗 ...
- 前端之JavaScript基础
前端之JavaScript基础 本节内容 JS概述 JS基础语法 JS循环控制 ECMA对象 BOM对象 DOM对象 1. JS概述 1.1. javascript历史 1992年Nombas开发出C ...
- 第三篇:web之前端之JavaScript基础
前端之JavaScript基础 前端之JavaScript基础 本节内容 JS概述 JS基础语法 JS循环控制 ECMA对象 BOM对象 DOM对象 1. JS概述 1.1. javascript ...
- 初识 Javascript.01 -- Javascript基础|输出方式、变量、变量命名规范、数据类型、
Javascript基础 1 聊聊Javascript 1.1 Javascript的历史来源 94年网景公司 研发出世界上第一款浏览器. 95年 sun公司 java语言诞生 网景公司和su ...
随机推荐
- Flutter 增加三方库卡在flutter package get 的解决办法
修改 pubspec.yaml 文件增加第三方库之后,AndroidStudio 像往常一样提示 需要 package get. 然后一直卡在 Running "flutter packag ...
- pytest_04_测试用例setup和teardown
学过unittest的都知道里面用前置和后置setup和teardown非常好用,在每次用例开始前和结束后都去执行一次. 当然还有更高级一点的setupClass和teardownClass,需配合@ ...
- 魔法 [线段树优化DP]
也许更好的阅读体验 \(\mathcal{Description}\) 小 \(D\) 正在研究魔法. 小 \(D\) 得到了远古时期的魔法咒语 \(S\),这个咒语共有 \(n\) 个音节,每个音节 ...
- An Illustrated Proof of the CAP Theorem
An Illustrated Proof of the CAP Theorem The CAP Theorem is a fundamental theorem in distributed syst ...
- loj#10067 构造完全图(最小生成树)
题目 loj#10067 构造完全图 解析 和kruscal类似,我们要构造一个完全图,考虑往这颗最小生成树里加边 我们先把每一条边存下来, 把两个端点分别放在不同的集合内,记录每个集合的大小,然后做 ...
- js-Date对象(九)
一.Date对象的创建1.new Date()[创建当前时间对象]eg: var date = new Date(); console.log(date); //Thu Jul 18 2019 18: ...
- k8s维护常用命令
k8s维护 1. 不可调度 kubectl cordon k8s-node-1 kubectl uncordon k8s-node-1 #取消 2.驱逐已经运行的业务容器 kubectl drain ...
- 木马防杀 花指令 OllyDbg
打开木马 入口地址 添加花指令 全0的地方,可以插入花指令 保存为可执行文件 随便选择几行,右击 保存文件
- day 02 预科
目录 什么是编程语言 什么是编程 为什么要编程 计算机的组成 CPU 存储器 I/O设备(Input/Output设备) 输入设备 输出设备 多核CPU 32位和64位 机械硬盘工作原理 机械手臂 磁 ...
- 小米8seroot后更改hosts文件记录
1.先备份原有文件,在设置中有个备份与恢复,可以备份,备份后链接电脑,传电脑上 2.下载开发版miui,安装 3.解bl锁,先到官网申请,按照提示操作. 4.备份文件传到手机,恢复文件 5.获得roo ...