11_window对象

女爷i 2022-07-16 16:24 169阅读 0赞

html5

id=123

<iframe name="nested" src="" width="90%" height="75px"></iframe>
    <script type="text/javascript">
        /* 获取window对象 
         document.defaultView;
         window;
         */
        var ele = document.querySelector("#p1");
        ele.innerHTML += window.outerWidth + "\n";//窗口高度，包括边框和菜单栏
        ele.innerHTML += window.outerHeight + "\n";//窗口宽度，包括边框和菜单栏
        ele.innerHTML += window.innerWidth + "\n";//获取窗口内容区域的宽度
        ele.innerHTML += window.innerHeight + "\n";//获取窗口内容区域的高度
        ele.innerHTML += window.screen.width + "\n";//屏幕宽度
        ele.innerHTML += window.screen.height + "\n";//屏幕高度
    
        /* 与窗口交互 
        blur():窗口失去焦点
        close():关闭窗口
        focus():获得键盘焦点
        print():提示用户打印界面
        scrollBy(x,y):文档相对于当前位置进行滚动
        scrollTo(x,y):滚动到指定位置
        stop():停止载入文档
         */
    
        /* 对用户进行提示 
        alert(msg)
        confirm(msg)
        prompt(msg,val)
        showModalDialog(url)
         */
    
        /* ###################获取基本信息
         document:返回与此窗口关联的document对象
         location:提供当前文档地址的详细信息
         history:提供浏览器历史的访问
             back():浏览历史后退
             forward():浏览历史前进
             go(index):转到相对于当前文档的某个浏览历史位置，可以直接添加url
             length():浏览历史中的项目数量
             pushState(state,title,url)：浏览器历史添加一个条目,好处体现在用户导航到别处，然后返回时，能回原位置
             replaceState(state,title,url):替换浏览历史中的当前条目
             state()：返回浏览器历史中关联当前文档的状态数据
         */
        var b1 = document.querySelector("#b1");
        b1.onclick = function(e) {
            //浏览历史添加条目
            window.history.pushState("", "", "2.html?" + e.target.id);
            //浏览历史替换条目
            window.history.replaceState("", "", "2.html?" + e.target.id);
        }
    
        /* 在浏览器历史中保存复杂状态 */
        var stateObj = {
            name : "zhangsan",
            age : 15
        };
        /* 状态对象关联到当前文档上 */
        window.history.pushState(stateObj, "");
        /* 用户返回到文档，2种方式获取状态对象 */
        if (window.history.state) {
            var obj = window.history.state;
            alert(obj.name);
            alert(obj.age);
        }
        /* 并非所有浏览器支持，采用监听获取 */
        window.onpopstate = function(e) {
            alert(e.name);
            alert(e.age);
        }
    
        /* ##################使用跨文档消息传送 
        defaultViem:返回活动文档的window
        frames:返回文档内嵌iframe元素的window对象数组
        opener:返回打开当前浏览上下文环境的window
        parent：返回当前window的父window
        self:返回当前文档的window
        top：返回最上层的window
        length:返回文档内嵌的iframe元素数量
        index：返回指定索引位置内嵌文档的window
        name:返回指定名称内嵌文档的window
         */
        /* 发送消息 
            window["nested"].postMessage("消息体", "脚本来源");
        */
        /* 接受消息在另一个脚本里面采用监听器事件 
        window.addEventListener("message", receiveMessage, false);
        function receiveMessage(e) {
            document.writeln(e.date);
        }
        */
    
    
        /* ##################计时器  */
        var timeId=window.setTimeout(function(){alert(1)},5000);//使用超时计时器，只执行一次
        var intervalId=window.setInterval(function(){alert(1)},100);//间隔计时器，无限次
        window.clearTimeout(timeId);
        window.clearInterval(intervalId);
    
    
    
    
    
    
    
    </script>

发表评论取消回复

表情：

评论列表（有 0 条评论，169人围观）

还没有评论，来说两句吧...

相关阅读

相关 Window 对象

indow对象表示浏览器打开的窗口。 window对象集合：frames\[\]–返回窗口中所有命名的框架。 Window对象属性：innerHeight–返回窗...

悠悠/ 2024年04月19日 11:59/ 0 赞/ 67 阅读

相关 window 对象

window 对象的属性 window 对象的属性 <table style="width:500px;"> <tbody> <tr> <td>属性

小咪咪/ 2024年04月06日 13:15/ 0 赞/ 50 阅读

相关 Window对象

Window对象学习路线：[JavaScript基础语法（输出语句）][JavaScript]\->[JavaScript基础语法（变量）][JavaScript 1]

超、凢脫俗/ 2024年03月31日 13:05/ 0 赞/ 85 阅读

相关 JDK11 在Windows11平台安装（双11）

目录前言一、安装前说明 1.系统要求 2.多版本安装二、JDK11安装三、安装成功验证 1.验证

悠悠/ 2024年03月16日 17:35/ 0 赞/ 73 阅读

相关 Windows 安装 JDK-11

目标在 windows 上安装 JDK-11 安装下载 JDK 安装包地址下载[https://download.csdn.net/download/m

╰+攻爆jí腚メ/ 2023年10月05日 22:16/ 0 赞/ 67 阅读

相关 Windows11快速入门

1、如何快速上手Win11 -------------------- > Win11官网：https://www.microsoft.com/zh-cn/windows

我就是我/ 2023年09月24日 16:18/ 0 赞/ 44 阅读

相关 Windows 11 抢先体验

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

￡神魔★判官ぃ/ 2022年10月04日 13:58/ 0 赞/ 314 阅读

相关 Windows 11 即将问世 | Windows 10 和 Windows 11 该如何抉择

> 全新 Windows 11 将于 10 月 5 日上市，微软宣布了运行新操作系统所需的最低配置要求。了解这一点后，你就可以查看你的 Windows10 系统是否能够完成升级

Love The Way You Lie/ 2022年09月10日 07:17/ 0 赞/ 150 阅读

相关 11_window对象

html5 id=123 <iframe name="nested" src="" width="90%" heig

女爷i/ 2022年07月16日 16:24/ 0 赞/ 170 阅读

相关 window对象

window对象对象：document/event/history/frame/location 属性： opener 返回对创建此窗口的窗口即父窗口

曾经终败给现在/ 2022年06月14日 09:46/ 0 赞/ 161 阅读