BOM 事件

1.window.confirm(“msg”)

功能:显示一个带有指定消息和包含确定和取消按钮的对话框。点击确定返回true,取消返回false;

eg:点击确定按钮删除小米5
技术要点:点击确定resutl返回true,取消返回false
    <div>
        <p id="mi">小米</p>
        <button id="btn">删除</button>
        <script>
            var mi=document.getElementById("mi");
            var btn=document.getElementById("btn");
            btn.onclick=function(){
                var result = window.confirm("你确定删除小米吗?");
                if(result){
                    mi.parentNode.removeChild(mi);
                }
            }
        </script>
    </div>
confirm.png

经自己敲代码发现,window.alert 和 window.confirm都是弹出对话框,只不过前者是弹出一个带确定按钮的警告框。后者是带确定和取消按钮的对话框。

2.window.prompt(“text,defaultText”) [ 不太熟悉,需要实际操作]

参数说明:

text:在对话框中显示的文本

defaultText:默认输入文本

返回值:点取消按钮,返回null

    <script>
        var ping= window.prompt("请问平帅帅不帅?","帅");
        document.write(ping);
    </script>
prompt.png

即点击确定就是显示对话框中的文本,点击取消按钮就是显示null。

3.window.open(pageURL,name,parameters)

参数说明:

pageURL:子窗口的路基

name:子窗口的句柄(name声明了新窗口的名称,方便后期通过name对子窗口进行引用)

parameters:窗口参数(各参数之间用逗号分隔)

<body>
    <a href="#" onClick="window.open('01.html', '01', 'width=400, height=400, scrollbars=no'); return false">
        [打开01.html]
    </a>
</body>
open.png

参数.png

4.screen对象 (屏幕)

screen对象包含有关客户端显示屏幕的信息

screen.availWidth

screen.availHeight

<script>
        document.write("可用宽度:"+screen.availWidth);
        document.write("可用高度:"+screen.availHeight);
    </script>
screen.png

5.location对象

location对象提供了与当前窗口中加载的文档有关信息,还提供了一些导航的功能,他既是window对象的属性,也是document对象的属性。

location.href与window.location.href等价

语法:location.hash

功能:返回URL中的hash(#号后跟0或多个字符),如果不包含则返回空字符串

语法:location.host

功能:返回服务器名称和端口号

语法:location.hostname

功能:返回不带端口号的服务器名称

语法:location.pathname

功能:返回URL中的目录和(或)文件名

语法:location.port

功能:返回URL中指定的端口号,如果没有,返回空字符串

eg:location.assign(加载新文档)

    <button id="btn" onclick="myfunction()">fenbie</button>
    <script>
        function myfunction(){
            location.assign("http://www.w3school.com.cn");
        }
    </script>

6. history对象

history对象保存了用户在浏览器中访问页面的历史记录

语法:history.back()

功能:回到历史记录的上一步

相当于是用了history.go(-1)

//-1表示前一步,-2前两步

语法:history.go(1)

功能:回到历史记录的前一步

相当于history.forward()

语法:history.go(-n)

功能:回到历史记录的前n部

语法:history.go(n)

功能:回到历史记录的后n步

1.history.back() 方法加载历史列表中的前一个 URL。
这与在浏览器中点击后退按钮是相同的
function goBack()
  {
  window.history.back()
  }

2.history forward() 方法加载历史列表中的下一个 URL。

这与在浏览器中点击前进按钮是相同的

function goForward()
  {
  window.history.forward()
  }
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 217,826评论 6 506
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,968评论 3 395
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 164,234评论 0 354
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,562评论 1 293
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,611评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,482评论 1 302
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,271评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,166评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,608评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,814评论 3 336
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,926评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,644评论 5 346
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,249评论 3 329
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,866评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,991评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,063评论 3 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,871评论 2 354

推荐阅读更多精彩内容

  • ★【知识点】: 1、掌握什么是BOM2、掌握BOM的核心-window对象3、掌握window对象的控制、弹出窗口...
    越IT阅读 2,445评论 0 2
  • 什么是BOM?BOM windowwindow是浏览器的一个实例,在浏览器中,window对象有双重角色,它既是通...
    Adapa阅读 419评论 0 0
  •   ECMAScript 是 JavaScript 的核心,但如果要在 Web 中使用 JavaScript,那么...
    霜天晓阅读 878评论 0 0
  • DOM、BOM、事件知识总结 DOM相关知识 DOM(Document Object Model)文档对象模型 如...
    杜梦石阅读 479评论 0 3
  • 今天忙乎了一天,大家一起加班到十一点了才回家。洗洗睡了,明天还有事情。 计划 7:00 看书 8:00 ...
    郑清文阅读 57评论 0 0