开启辅助访问
帐号登录 |立即注册

JS的Location对象属性与方法

 
JavaScript location 对象中包含了有关当前页面链接(URL)的信息,例如当前页面的完整 URL、端口号等,我们可以通过 window 对象中的 location 属性来获取 location 对象。由于 window 对象是一个全局对象,因此在使用window.location时可以省略 window 前缀,例如window.location.href可以简写为location.href
location 对象中的属性下表中列举了 JavaScript location 对象中常用的属性及其描述:

属性描述
hash返回一个 URL 中锚的部分,例如:http://c.biancheng.net#js 中的 #js。
host返回一个 URL 的主机名和端口号,例如 http://c.biancheng.net:8080
hostname返回一个 URL 的主机名,例如 http://c.biancheng.net
href返回一个完整的 URL,例如 http://c.biancheng.net/javascript/location-object.html
pathname返回一个 URL 中的路径部分,开头有个/。
port返回一个 URL 中的端口号,如果 URL 中不包含明确的端口号,则返回一个空字符串' '。
protocol返回一个 URL 协议,即 URL 中冒号:及其之前的部分,例如 http: 和 https:。
search返回一个 URL 中的查询部分,即 URL 中?及其之后的一系列查询参数。

示例代码如下:
[JavaScript] 纯文本查看 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JavaScript</title>
</head>
<body>
    <a href="http://c.biancheng.net:8080/javascript/location-objcet.html?course=javascript&title=location#content" id="url"></a>
    <script type="text/javascript">
        var url = document.getElementById('url');
        document.write("<b>hash:</b>" + url.hash + "<br>");
        document.write("<b>host:</b>" + url.host + "<br>");
        document.write("<b>hostname:</b>" + url.hostname + "<br>");
        document.write("<b>href:</b>" + url.href + "<br>");
        document.write("<b>pathname:</b>" + url.pathname + "<br>");
        document.write("<b>port:</b>" + url.port + "<br>");
        document.write("<b>protocol:</b>" + url.protocol + "<br>");
        document.write("<b>search:</b>" + url.search + "<br>");
    </script>
</body>
</html>



运行结果如下:
hash:#content
host:c.biancheng.net:8080
hostname:c.biancheng.net
href:http://c.biancheng.net:8080/java ... le=location#content
pathname:/javascript/location-objcet.html
port:8080
protocol:http:
search:?course=javascript&title=location
location 对象中的方法下表中列举了 JavaScript location 对象中常用的方法及其描述:

方法说明
assign()加载指定的 URL,即载入指定的文档。
reload()重新加载当前 URL。
replace()用指定 URL 替换当前的文档,与 assign() 方法不同的是,使用 replace() 替换的新页面不会保存在浏览历史中,用户不能使用后退来返回该页面。
toString()与 href 属性的效果相同,以字符串的形式返回当前完整的 URL。

示例代码如下:

[JavaScript] 纯文本查看 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JavaScript</title>
</head>
<body>
    <a href="http://c.biancheng.net:8080/javascript/location-objcet.html?course=javascript&title=location#content" id="url"></a>
    <button>assign()</button>
    <button>reload()</button>
    <button>replace()</button>
    <button>toString()</button>
    <script type="text/javascript">
        var url = 'http://c.biancheng.net';
        function myAssign(){
            location.assign(url);
        }
        function myReload(){
            location.reload();
        }
        function myReplace(){
            location.replace(url);
        }
        function myToString(){
            var url = document.getElementById('url');
            var str = url.toString();
            alert(str);
        }
    </script>
</body>
</html>

以上就是本文的全部内容,感谢大家支持JScript之家——编程学习者社区!


回复

使用道具 举报

0 个回复

倒序浏览

快速回复

您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

友情链接
  • 艾Q网

    提供设计文章,教程和分享聚合信息与导航工具,最新音乐,动漫,游戏资讯的网站。