zoukankan      html  css  js  c++  java
  • JavaScript BOM

    window的open和close方法

    <body>
            <script type="text/javascript">
                /*
                    1、BOM编程中,window对象是顶级对象,代表浏览器窗口。
                    2、window有open和close方法,可以开启窗口和关闭窗口。
                */
               
            </script>
            
            <input type="button" value="开启百度(新窗口)" onclick="window.open('http://www.baidu.com');" />
            <input type="button" value="开启百度(当前窗口)" onclick="window.open('http://www.baidu.com', '_self');" />
            <input type="button" value="开启百度(新窗口)" onclick="window.open('http://www.baidu.com', '_blank');" />
            <input type="button" value="开启百度(父窗口)" onclick="window.open('http://www.baidu.com', '_parent');" />
            <input type="button" value="开启百度(顶级窗口)" onclick="window.open('http://www.baidu.com', '_top');" />
            
            <input type="button" value="关闭"  onclick="window.close()"/>
        </body>

     

    弹出确认框

    <body>
            <script type="text/javascript">
                function del(){
                    if(window.confirm("亲,确认删除数据吗?")){
                        alert("delete data ....");
                    }
                }
            </script>        
            <!--删除操作的时候都要提前先得到用户的确认。-->
            <input type="button" value="弹出确认框(删除)" onclick="del();" />
        </body>

    设置顶级窗口

    这是A窗口,里面包含一个子窗口B

    <body>
            <!--在当前窗口中隐藏的内部窗体。-->
            <!-- <iframe src="http://www.baidu.com"></iframe> -->
            <iframe src="child-window.html"></iframe>
        </body>

    这是B窗口,现在要把B窗口设置为顶级窗口

    <body>
            child window.
            <script type="text/javascript">
                window.onload = function(){
                    var btn = document.getElementById("btn");
                    btn.onclick = function(){
                        if(window.top != window.self){
                            window.top.location = window.self.location;
                        }
                    }
                }
            </script>
            <input type="button" value="将当前窗口设置为顶级窗口" id="btn" />
        </body>

    控制前进后退页面 window.history.back()/go(1)

    <body>
            <a href="007.html">007页面</a>
            <input type="button" value="前进" onclick="window.history.go(1)"/> 
        </body>
    <body>
            007 page!
            <input type="button" value="后退" onclick="window.history.back()" />
            <input type="button" value="后退" onclick="window.history.go(-1)" />
        </body>

    设置浏览器地址栏

    <body>
            
            <script type="text/javascript">
                function goBaidu(){
                    document.location = "http://www.tmall.com";
                }
            </script>
            
            <input type="button" value="新浪" onclick="goBaidu();"/>
            <input type="button" value="baidu" onclick="window.open('http://www.baidu.com');" />
            
        </body>
    </html>
    
    <!--
        总结,有哪些方法可以通过浏览器往服务器发请求?
            1、表单form的提交。
            2、超链接。<a href="http://localhost:8080/oa/save?username=zhangsan&password=123">用户只能点击这个超链接</a>
            3、document.location
            4、window.location
            5、window.open("url")
            6、直接在浏览器地址栏上输入URL,然后回车。(这个也可以手动输入,提交数据也可以成为动态的。)
            
            以上所有的请求方式均可以携带数据给服务器,只有通过表单提交的数据才是动态的。
    -->
  • 相关阅读:
    Redis
    vscode
    uget + aria2
    Nodejs 安装
    NPM
    ?Swift获取手机设备信息
    C语言的32个关键字
    MVC-Html.Label(TextBox、TextArea、RadioButton、CheckBox)
    常用正则表达式
    MVC-Razor引擎布局
  • 原文地址:https://www.cnblogs.com/zsben991126/p/12699424.html
Copyright © 2011-2022 走看看