BOM相关方法及属性
browser objec tmodel浏览器对象模型
BOM里面的方法大多在window对象底下,window代表窗口,也就是说,在BOM里面大多调用window下面的东西。
1.open方法是window底下的一个方法
window.open(页面的地址URL,打开的方式)方法,打开一个新的界面
如果URL为空,则默认打开一个空白页面;如果打开方式为空,则默认新窗口方式打开
返回值:返回新打开的窗口的window对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<input type="button" value="点击跳转" id="btn">
</body>
<script>
function $(id) {
return document.getElementById(id)
}
$('btn').onclick=function(){
var newPage=window.open()
alert(newPage)
}
</script>
</html>
得到:
因此可以设置新界面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<input type="button" value="点击跳转" id="btn">
</body>
<script>
function $(id) {
return document.getElementById(id)
}
$('btn').onclick=function(){
var newPage=window.open()
newPage.document.body.style.background='red'//将新界面的背景色设置为红
}
</script>
</html>
运行为:
2.close()方法 关闭当前窗口
火狐:不关闭
谷歌:直接关闭
IE:先询问
注意:可以在本窗口关闭通过Js打开的新窗口
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<input type="button" value="点击跳转" id="btn1">
<input type="button" value="关闭窗口" id="btn2">
</body>
<script>
function $(id) {
return document.getElementById(id)
}
$('btn1').onclick=function(){
newPage=window.open()//前期知识,不带var的变量为全局变量
}
$('btn2').onclick=function(){
newPage.close()
}
</script>
</html>
3.window.navigator.userAgent------获取浏览器信息
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
<script>
alert(window.navigator.userAgent);
</script>
</html>
不同的浏览器,信息不同
所以,根据这个属性,可以判断是否是某个浏览器。比如:如果是谷歌浏览器,则弹出我是谷歌,否则弹出我不是谷歌。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
<script>
if(window.navigator.userAgent.indexOf('Chrome')){
alert('我是谷歌');
}else{
alert('我不是谷歌')
}
</script>
</html>
运行为:
4.window.location------地址栏上的信息
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
<script>
alert(window.location);
</script>
</html>
注意:其值为一个数组
其中window.location后面还有几个属性
1)window.location.href------同样获取地址栏的全部信息,即相当于url
2)window.location.search-------地址栏?后面的内容(包括问号)
3)window.location.hash------地址栏#后面的值(包括#)
BOM相关方法及属性的更多相关文章
- [妙味 DOM] 第二课:DOM、BOM相关方法及属性
知识点总结 获取样式.增加样式.删除样式函数的封装 表格 tHead tBodies tFoot rows 行 cells 列 表单 表单可以通过name来获取元素:表单.name值 onchange ...
- BOM下的属性和方法---上
-------------BOM------------------------------------------------ 三个系统对话框 浏览器可以通过alert().confirm()和 ...
- BOM下的属性和方法---下
继续BOM下的属性和方法---上 代码示例(亲测)2: <title>location对象的属性</title> <script> //服务器环境我再此次演示中 ...
- DOM相关方法,属性整理
DOM相关方法,属性整理1.获取元素的方法 1根据id获取对象 document.getElementById(''); 2根据标签名获取对象 document.getElementsByTagNam ...
- BOM主要对象属性方法总结
BOM window对象 浏览器实例,全局对象 1.窗口位置: screenTop,screenLeft(screenX,screenY):窗口相对于屏幕左边和上边的位置 moveTo(x,y):将窗 ...
- BOM 窗体相关属性以及页面可见区域的获取方式
1 在IE Safari Oper Chrome 都提供了screenLeft和screenTop属性: screenLeft : 相对于屏幕左边的距离 screenTop : 相对于屏幕上边的距离 ...
- JavaScript中常用的BOM对象(属性、方法)
window对象 定义: 一个浏览器窗口实例 与窗口有关的信息(应用程序编程接口) ECMAScript规定的Global对象 方法 open(url),返回标识符 引用 即将打开窗口的.(调用该引用 ...
- 理解 NgModelController 中相关方法和属性
1. 理解$formatters和$parsers方法 angular的双向绑定可以实现view和model中的值自动同步,但有时候我们不想让用户输入的(view值)和发送给后台的(model值)并不 ...
- 进程&线程(二):Thread相关方法与属性
学习自:python进程.线程.协程 - 张岩林 - 博客园 1.threading.Thread Thread方法 方法(使用方法为Thread.xxx) 说明 start() 激活线程 getNa ...
随机推荐
- Array + two points leetcode.18 - 4Sum
题面 Given an array nums of n integers and an integer target, are there elements a, b, c, and d in num ...
- nohub
nohup command > myout.file 2>&1 & nohup command > /dev/null 2>&1 &
- elasticsearch + kibana + x-pack + logstash_集群部署安装
elasticsearch 部分总体描述: 1.elasticsearch 的概念及特点.概念:elasticsearch 是一个基于 lucene 的搜索服务器.lucene 是全文搜索的一个框架. ...
- 《数据结构与算法之美》 <05>链表(下):如何轻松写出正确的链表代码?
想要写好链表代码并不是容易的事儿,尤其是那些复杂的链表操作,比如链表反转.有序链表合并等,写的时候非常容易出错.从我上百场面试的经验来看,能把“链表反转”这几行代码写对的人不足 10%. 为什么链表代 ...
- Mysql读写分离 及高可用高性能负载均衡实现
什么是读写分离,说白了就是mysql服务器读的操作和写的操作是分开的,当然这个需要两台服务器,master负责写,slave负责读,当然我们可以使用多个slave,这样我们也实现了简单意义上的高可用和 ...
- 0005SpringBoot中用Junit测试实体类中绑定yml中的值
1.编写SpringBoot的引导类 package springboot_test.springboot_test; import org.springframework.boot.SpringAp ...
- 用python计算最高投标限价
题目是文绉绉的说法,背景来于群里提问,是一份文件里面关于最高投标限价的确定. 最高投标限价下浮率在开标前在开标现场采取逐标段摇珠方式确定,摇珠操作办法如下:在下浮率摇珠范围内,以0.1%为以一档次增序 ...
- Python 字节码bytecode
字节码bytecode python把源码文件编译成字节码文件,存放在__pycahe子目录内,用.pyc结尾.之后如果不再修改源码文件,运行时则使用*.pyc文件编译成机器码,这样不但运行速度快,而 ...
- Fastdfs集群搭建
1.关于集群,网上说最少要三台,其实也没必要,两台就够了 2.实验环境 192.168.2.201 tracker.storage.nginx + fastdfs-nginx-module-maste ...
- http响应Last-Modified和ETag
http响应Last-Modified和ETag [日期:2008-06-16] 来源: 作者: [字体:大 中 小] 基础知识 1) 什么是”Last-Modified”? 在浏览器第一次请求某一 ...