javascript bom操作
BOM
BOM介绍
全称 Browser Object Mode 浏览器对象模式
操作浏览器的API接口。比如浏览器自动滚动
Windows对象的顶层部分是BOM的顶层(核心)对象,所有的对象都是通过它延申出来的,也可以称为windowns的子对象。
DOM是BOM的一部分
windows对象:
- windows对象是JavaScript中的顶级对象
- 全局变量/自定义函数也是windows对象的属性和方法
- window对象下的属性和方法调用时,可以省略window
BOM的常见内置方法和内置对象
window对象
弹出系统对话框
比如说,alert(1)是window.alert(1)的简写,因为他是window的子方法。系统对话框有下面三种方法:
alert(); //不同浏览器中的外观是不一样的
confirm(); //兼容不好
prompt(); //不推荐使用
打开窗口 关闭窗口
1. 打开窗口
window.open('http://www.baidu.com','_block')
// url: 要打开的地址
// target:新窗口的位置 可以是:_block _self _parent 父框架
2.关闭窗口
window.close(); // 关闭当前打开的页面
获取窗口的宽高
window.innerHeight; // 获取浏览器的内部高度
388
window.innerWidth; // 获取浏览器的内部宽度
1536
// 提示: 随着窗口的缩小,所以获取到的宽度和高度也会发生变化
Location对象
window.location可以简写为location。location相当于浏览器地址栏,可以将url解析为独立的片段
location对象的属性
- href:操作地址栏里的url 进行跳转
- host:主机名,包括端口
- hash:返回url#号后面的内容 包含#
- hostname:主机名
- pathname:url中的路径部分
- protocol:协议 一般http或者https
- search:查询字符串
navigator对象
window.navigator 的一些属性可以获取客户端的一些信息。
- useragent:系统,浏览器
- platform:浏览器支持的系统 win mac
console.log(navigator.userAgent);
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36
console.log(navigator.platform);
Win32
history对象
返回和前进的操作
// 返回上一次
history.back();
history.go(-1) // 0表示刷新当前页面
// 前进一次
history.forward();
history.go(1)
screen对象(了解即可)
屏幕对象,不常用。
screen.availWidth // 可用的屏幕宽度
screen.availHeight // 可用的屏幕高度
定时器
在js的定时器中分为两种:setTimeout() 和 setInterval()
setTimeout()
只在指定时间后执行一次
// setTimeout(函数,时间)
var t1 = setTimeout(fn,4000);
var t2 = setTimeout(fn,1000);
var t3 = setTimeout(fn,1000);
function fn(){
alert('hello world;')
}
console.log(t1)
clearTimeout(t2); // 去除定时器
clearTimeout(t3);
setIntervar()
在指定时间内周期循环执行
var t = setInterval(fn,1000);
function fn(){
console.log('hello')
}
clearTimeout(t)
javascript bom操作的更多相关文章
- javascript bom 编程
javascript bom 编程 BOM: 浏览器对象模型 DOM Window :窗口Window Document 属性: status :状态栏 self:自己 ...
- JavaScript BOM DOM 对象
title: JavaScript BOM DOM 对象 tags: JavaScript --- browser object model document onject model BOM对象 w ...
- JS的BOM操作语法
整理了一下JS的BOM操作语法,这里记录一下. <!DOCTYPE html> <html> <head> <meta charset="utf-8 ...
- JavaScript——BOM和DOM
什么是BOM bom:浏览器对象模型 什么是DOM dom:文档对象模型 BOM操作: 调用windows浏览器窗口 windows对象可以通过点调用子对象 windows.navigator对象,可 ...
- JavaScript高级:JavaScript面向对象,JavaScript内置对象,JavaScript BOM,JavaScript封装
知识点梳理 课堂讲义 1.JavaScript面向对象 1.1.面向对象介绍 在 Java 中我们学习过面向对象,核心思想是万物皆对象. 在 JavaScript 中同样也有面向对象.思想类似. 1. ...
- BOM操作
BOM操作 //浏览器对象模型 opener=window.open(页面的url,打开方式) opener.document.body.style.background="red" ...
- javascript DOM 操作 attribute 和 property 的区别
javascript DOM 操作 attribute 和 property 的区别 在做 URLRedirector 扩展时,注意到在使用 jquery 操作 checkbox 是否勾选时,用 at ...
- javascript DOM 操作
在javascript中,经常会需要操作DOM操作,在此记录一下学习到DOM操作的知识. 一.JavaScript DOM 操作 1.1.DOM概念 DOM :Document Object Mode ...
- select元素javascript常用操作 转
/*------------------------------------------------------ *作者:xieyu @ 2007-08-14 *语言:JavaScript *说明:s ...
随机推荐
- cgp的辣鸡比赛题解
目录 cgp的gcd 题目链接 思路 代码 cgp调戏妹子 题目链接 思路 代码 cgp的序列 题目链接 思路 代码 cgp的背包 题目链接 思路 代码 cgp的gcd 题目链接 传送门 思路 首先看 ...
- C++ 如何进阶?
1.C++的用途和意义 总体来说,C++作为一门软件开发语言,它的流行度是在减少的.主要原因在于语言的复杂和灵活导致软件开发成本提高,这体现在开发周期和人力上.它不适用于startup公司的快速开发, ...
- 【洛谷】P1275 魔板(暴力&思维)
题目描述 有这样一种魔板:它是一个长方形的面板,被划分成n行m列的n*m个方格.每个方格内有一个小灯泡,灯泡的状态有两种(亮或暗).我们可以通过若干操作使魔板从一个状态改变为另一个状态.操作的方式有两 ...
- 常用spaceclaim脚本(三)
拉伸曲线 ptList=List[Point]() #定义一个点的列表 ptList.Add(Point.Create(MM(11),MM(-14),MM(0))) #创建点,并放入列表当中 ptLi ...
- JVM 扩展类加载器1
1.创建类 public class MyTest19 { public static void main(String[] args) throws Exception { System.out.p ...
- Spring’s RestTemplate
Spring’s RestTemplate /** * After the word document is generated in memory we can upload it to the s ...
- cache-control: max-age=1,s-maxage=1
cache-control: max-age=1,s-maxage=1
- 如何改为root用户 并挂载
改为root用户才能挂载,使用的命令是sudo su,换成自己就su + 名字就好了,比如bnrc. 进入root之后,执行命令mount /dev/sdb/ /diskb/,即mount + 使用的 ...
- snmpwalk 安装与使用详解-windows下
snmpwalk是SNMP的一个工具,它使用SNMP的GETNEXT请求查询指定OID(SNMP协议中的对象标识)入口的所有OID树信息,并显示给用户.通过snmpwalk也可以查看支持SNMP协议( ...
- mysql 安装参考
https://blog.csdn.net/qq_38756992/article/details/84929787 https://www.cnblogs.com/joyny/p/10991194. ...