js- BOM

最新推荐文章于 2024-05-15 15:59:38 发布
最新推荐文章于 2024-05-15 15:59:38 发布
阅读量71 收藏
点赞数 1
分类专栏： js2
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_35187942/article/details/85921220
版权

BOM:Browser Object Model 浏览器对象模型

open(页面的地址url,打开的方式)方法 打开一个新的窗口（页面）

    如果url为空，则默认打开一个空白页面

    如果打开方式为空，默认为新窗口方式打开

返回值：返回新打开的窗口的window对象

<!DOCTYPE html>
<html>
    <head>
        <meta charset="{CHARSET}">
        <title></title>
        <script>
            window.onload = function(){
                var aInput = document.getElementsByTagName('input');
                aInput[0].onclick = function(){
                    window.open();
                }
            }
        </script>
    </head>
    <body>
        <input type="button" value="打开新窗口" />
    </body>
</html>

aInput[0].onclick = function(){
          window.open('http://www.baidu.com','_self');
 }

打开的新窗口，可以对新窗口进行操作

<!DOCTYPE html>
<html>
    <head>
        <meta charset="{CHARSET}">
        <title></title>
        <script>
            window.onload = function(){
                var aInput = document.getElementsByTagName('input');
                aInput[0].onclick = function(){
                    opener = window.open();
                    opener.document.body.style.background = 'red';
                }
            }
        </script>
    </head>
    <body>
        <input type="button" value="打开新窗口" />
    </body>
</html>

close()方法 关闭窗口

aInput[1].onclick = function(){
                    window.close();
                }
            }
        </script>
    </head>
    <body>
        <input type="button" value="打开新窗口" />
        <input type="button" value="关闭新窗口" />
    </body>

注意：1、火狐：默认无法关闭

           2、chrome:直接关闭

           3、ie:询问用户

可以关闭在本窗口中通过js方法打开的新窗口

<!DOCTYPE html>
<html>
    <head>
        <meta charset="{CHARSET}">
        <title></title>
        <script>
            window.onload = function(){
                var aInput = document.getElementsByTagName('input');
                aInput[0].onclick = function(){
                    opener = window.open();
                    opener.document.body.style.background = 'red';
                }
                aInput[1].onclick = function(){
                    window.close();
                }
                aInput[2].onclick = function(){
                    opener.close();
                }
            }
        </script>
    </head>
    <body>
        <input type="button" value="打开新窗口" />
        <input type="button" value="关闭窗口" />
        <input type="button" value="关闭新窗口" />
    </body>
</html>

window.navigator.userAgent->浏览器信息

<!DOCTYPE html>
<html>
    <head>
        <meta charset="{CHARSET}">
        <title></title>
        <script>
            alert(window.navigator.userAgent);
        </script>
    </head>
    <body>
    </body>
</html>

window.location:浏览器地址信息   是一个对象

window.location.href   ===  window.location  (地址栏地址信息)

<!DOCTYPE html>
<html>
    <head>
        <meta charset="{CHARSET}">
        <title></title>
        <script>
            alert(window.location);
        </script>
    </head>
    <body>
    </body>
</html>

window.location.search:url?后面的内容

window.location.hash:url#后面的内容

 

 

我的奋斗ing
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JS-BOM基本概念
qq_39244173的博客
10-31 444
BOM （Browser Object Model）即浏览器对象模型 window对象-浏览器上打开的一个窗口 BOM_系统对话框 浏览器可以通过调用系统对话框，向用户展示信息。 系统提供了三个函数，可以完成系统对话框的操作。 【注】window下的函数，都可以省略window直接去调用。原本：window.alert(""); alert(""); 【功能】直接弹出警告框 【参数】警告框上...
Js-Bom-refrence:Js Bom Refrence
04-04
Js-Bom-refrence Js bom refrence打开任何文本编辑器以查看该想法
JS-BOM
woshi6yi的博客
04-02 165
一、BOM的顶级对象（window）（可省略） window常见的事件onload 和DOMContentLoaded 1.onload事件 等待页面内容全部加载完毕之后，才执行js代码 2.DOMContentLoaded事件 是等DOM加载完，不包含图片、flash、css等 ，加载速度比load快 resize事件 当window的大小发生了变化就会触发，window.innerWidth得到窗口宽度 二、定时器 1.setTimeout定时器 语法规范：window.setTimeo
js- bom
qq_38535965的博客
09-15 37
bom浏览器模型，window是js最顶级对象 其设置了几个功能对象如上图在全局环境下声明的变量、函数都是window的属性或方法；window的属性和方法无需window.调用。
js - BOM
qq_42250642的博客
05-10 125
js - BOM BOMjs - BOM一、简介1.1 概述二、Navigator2.1 概述2.2 实例三、History3.1 概述四、Location4.1 概述五、定时器5.1 概述 一、简介 1.1 概述 BOM -浏览器对象模型 -在BOM中为我们提供了一组对象，用来完成对浏览器的操作 1、BOM对象 1）window -代表的是整个浏览器的窗口，同时w
JavaScript-BOM
qq_63063715的博客
07-22 128
JavaScript-BOM
JS-BoM
zhaoji1346790的博客
04-05 93
JS-BoM1.Document对象的常用属性2.Document对象的常用方法3.三种访问页面元素的区别4.visibility5.display 1.Document对象的常用属性 referrer: 返回载入当前文档的文档的URL 语法 ：document.referrer URL : 返回当前文档的URL 语法 ：document.URL 2.Document对象的常用方法 getElementById() ：返回对拥有指定id的第一个对象的引用 getElementsByName() ：返回带有
JS-BOM对象
xpmhhh的博客
03-09 111
BOM： - 浏览器对象模型 - BOM可以使我们通过JS来操作浏览器 - 在BOM中为我们提供了一组对象，用来完成对浏览器的操作 - BOM对象： Window：代表整个浏览器窗口，同时window也是网页中的全局对象 Navigator：代表当前浏览器的信息，通过该对象可以用来识别不同的浏览器 Location：代表当前浏览器的地址栏信息，通过location可以获取地址栏信息 History：代表浏览器的历史记录，可以通过该对象来操作浏览器的历史记录 Screen：代表用户的屏幕信息
JS-BOM— —BOM概述
mocoll的博客
08-19 226
一、BOM概述 BOM ( Browser Object Model )即浏览器对象模型,它提供了独立于内容而与浏览器窗C ]进行交互的对象,其核心对象是window。 BOM由一系列相关的对象构成,并且每个对象都提供了很多方法与属性。 BOM缺乏标准, JavaScript语法的标准化组织是ECMA , DOM的标准化组织是W3C , BOM最初是Netscape浏览器标准的一部分。 DOM ●浏览器对象模型。 ●DOM就是把[文档」当做一个[对象」来看待。 ●DOM 的顶级对象是document。 ●D
JavaScript-BOM编程
最新发布
weixin_44201223的博客
05-15 874
DOM对象 window对象的常见属性 window对象的常见方法
JS-BOM编程实例：设置顶级窗口
qq_43748400的博客
04-09 122
gulp-bom:将UTF-8 BOM添加到文件
05-26
口香糖将添加到文件从维基百科： Unicode标准允许使用UTF-8中的BOM，但既不需要也不建议使用它。 字节顺序在UTF-8中没有意义。... src ( 'app.js' ). pipe ( bom ( ) ). pipe ( gulp . dest ( 'dist' ) )) ;
实现JavaScript的组成----BOM和DOM详解
10-22
下面小编就为大家带来一篇实现JavaScript的组成----BOM和DOM详解。小编觉得挺不错的，现在分享给大家，也给大家做个参考，一起跟随小编过来看看吧
strip-bom:从字符串中删除UTF-8字节顺序标记（BOM）
04-29
从字符串中删除UTF-8（BOM） 从维基百科： Unicode标准允许使用UTF-8中的BOM，但既不需要也不建议使用它。 字节顺序在UTF-8中没有意义。 安装 $ npm install strip-bom 用法 import stripBom from 'strip-bom' ; ...
add-bom:将BOM表标记添加到UTF-8文件
05-20
将BOM表标记添加到文件 一个简单的cli实用程序，用于向UTF-8文件添加BOM表标记。 适合在npm版本中使用。... node add-bom.js -f file-without-bom.js 或来自package.json的npm脚本部分 add-bom -f file-without-bom.js
js 焦点事件
热门推荐
qq_35187942的博客
01-06 1万+
焦点：使浏览器能够区分用户输入的对象，当一个元素有焦点的时候，那么他就可以接收用户的输入。 我们可以通过一些方式给元素设置焦点 1 点击 2 tab 3 js 不是所有元素都能够接收焦点，能够相应用户操作的元素才有焦点 onfocus:当元素获取到焦点的时候触发 onblur：当元素失去焦点的时候触发 &lt;!DOCTYPE html&gt; &lt;html&gt;     &...
js 事件捕获
qq_35187942的博客
01-06 6797
&lt;!DOCTYPE html&gt; &lt;html&gt;     &lt;head&gt;         &lt;meta charset="{CHARSET}"&gt;         &lt;title&gt;&lt;/title&gt;         &lt;style&gt;             div{padding: 40px;}       
js 键盘事件
qq_35187942的博客
01-07 5583
onkeydown:当键盘按键按下的时候触发 onkeyup:当键盘按键抬起的时候触发 event.keyCode:数字类型 键盘按键的值 键值 ctrlKey,shiftKey,altKey 布尔值 当一个事件发生的时候，如果ctrl || shift || alt 是按下的状态，返回true,否则返回false 当鼠标按住ctrl键并点击页面，返回true，若只点击页面，则返回f...
js 事件的取消
qq_35187942的博客
01-06 3331
ie:obj.detachEvent(事件名称，事件函数); 标准：obj.removeEventListener(事件名称，事件函数，是否捕获); &lt;!DOCTYPE html&gt; &lt;html&gt;     &lt;head&gt;         &lt;meta charset="{CHARSET}"&gt;         &lt;title&gt;&lt;/titl..
js dom bom
10-28
JavaScript中的DOM和BOM分别指的是文档对象模型（Document Object Model）和浏览器对象模型（Browser Object Model）。DOM是用来操作HTML和XML文档的API，它将文档解析成一个由节点和对象（包含属性和方法的对象）...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值