js总结7

最新推荐文章于 2024-07-18 10:24:18 发布

一定不能掉头发

最新推荐文章于 2024-07-18 10:24:18 发布

阅读量45

点赞数

文章标签： javascript servlet html

本文链接：https://blog.csdn.net/LOOKOUTSTT/article/details/127059795

版权

History对象

History对象：有关客户访问过的URL的信息
back（）：加载History列表上的一个URL

forward(): 加载History列表下的一个URL

go("url" or number):加载History列表中的一个URL或要求浏览器移动指定的页面数

back()方法相当于后退按钮

forward()方法相当于前进按钮

go(1)代表前进1页，等价于forward()方法

go(-1)代表后退1页，等价于back()

第一个页面

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <input type="button" name="" id="btn" value="打开0.2html" />
        <script type="text/javascript">
            btn.onclick=function(){
                location.href="02.html"//跳转到02页面
            }
            </script>
    </body>

第二个页面

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <input type="button" name="" id="btn1" value="back" />
        <input type="button" name="" id="btn2" value="打开03.html" />
        <input type="button" name="" id="btn3" value="forward" />
        <input type="button" name="" id="btn4" value="go" />
        <script type="text/javascript">
            btn1.onclick=function(){
                history.back()//返回上一页
            }
            btn2.onclick=function(){
                location.href="03.html"//跳转到03页面
            }
            btn3.onclick=function(){
                history.forward()//跳转下一页
            }
            btn4.onclick=function(){
                history.go(1)//跳转下一页
            }
        </script>
    </body>
</html>

第三个页面

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <input type="button" name="" id="btn1" value="返回0.2html" />
        <input type="button" name="" id="btn2" value="go" />
        <script type="text/javascript">
            btn1.onclick=function(){
                location.href="02.html"//跳转02页面
            }
            btn2.onclick=function(){
                history.go(-1)//返回上一页
            }
        </script>
    </body>
</html>

Location对象

Location对象：有关当前URL的信息
属性：
host ：设置或检索位置或URL的主机名和端口号

hostname：设置或检索位置或URL的主机名部分
href：设置或检索完整的URL字符串
方法：
assign("url")：加载URL指定的新的HTML文档
reload()：重新加载当前页
replace("url")：通过加载URL指定的文档来替代当前文档

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <input type="button" name="" id="btn1" value="assign" />
        <input type="button" name="" id="btn2" value="reload" />
        <input type="button" name="" id="btn3" value="replace" />
        <script type="text/javascript">
            console.log(location.host)
            console.log(location.hostname)
            console.log(location.href)
            btn1.onclick=function(){
                location.assign("https://www.baidu.com/")
            }
            btn2.onclick=function(){
                location.reload()
            }
            btn3.onclick=function(){
                location.replace("https://www.baidu.com/")
            }
        </script>
    </body>
</html>

一定不能掉头发

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js总结7

go("url" or number):加载History列表中的一个URL或要求浏览器移动指定的页面数。replace("url")：通过加载URL指定的文档来替代当前文档。assign("url")：加载URL指定的新的HTML文档。forward(): 加载History列表下的一个URL。go(1)代表前进1页，等价于forward()方法。back（）：加载History列表上的一个URL。History对象：有关客户访问过的URL的信息。go(-1)代表后退1页，等价于back()
复制链接

扫一扫