地址栏

作者: 虎三呀 | 来源:发表于2018-02-08 14:06 被阅读0次
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
            <script type="text/javascript">
                /*
                 * Location
                 *  - 该对象中封装了浏览器的地址栏的信息
                 */
                window.onload = function(){
                    
                    //获取按钮对象
                    var btn = document.getElementById("btn");
                    
                    btn.onclick = function(){
                        
                        //如果直接打印location,则可以获取到地址栏的信息(当前页面的完整路径)
                        //alert(location);
                        
                        /*
                         * 如果直接将location属性修改为一个完整的路径,或相对路径
                         *  则我们页面会自动跳转到该路径,并且会生成相应的历史记录
                         */
                        //location = "http://www.baidu.com";
                        //location = "01.BOM.html";
                        
                        /*
                         * assign()
                         *  - 用来跳转到其他的页面,作用和直接修改location一样
                         */
                        //location.assign("http://www.baidu.com");
                        
                        /*
                         * reload()
                         *  - 用于重新加载当前页面,作用和刷新按钮一样
                         *  - 如果在方法中传递一个true,作为参数,则会强制清空缓存刷新页面
                         */
                        //location.reload(true);
                        
                        /*
                         * replace()
                         *  - 可以使用一个新的页面替换当前页面,调用完毕也会跳转页面
                         *      不会生成历史记录,不能使用回退按钮回退
                         */
                        location.replace("01.BOM.html");
                        
                    };
                    
                };
                
            </script>
        </head>
        <body>
            
            <button id="btn">点我一下</button>
            
            <h1>Location</h1>
            
            <input type="text" />
            <a href="01.BOM.html">去BOM</a>
        </body>
    </html>
    
    

    相关文章

      网友评论

          本文标题:地址栏

          本文链接:https://www.haomeiwen.com/subject/zmrttftx.html