document.location的用法实例

最新推荐文章于 2023-05-22 20:45:17 发布
最新推荐文章于 2023-05-22 20:45:17 发布
阅读量303 收藏
点赞数
文章标签： javascript ViewUI 
<html>
     <head>
         <title>document.location </title>
     </head>
     <body>
         <b>document.location使用举例 </b ><p>
          <script type ="text/javascript"> 
       
             document.write( " 当前位置： " + document.location + " <p> " );
             document.write( " 当前位置的url路径： " + document.location.pathname + " <p> " );    
             document.write( " 当前位置的url协议： " + document.location.protocol + " <p> " );
             document.write( " 当前位置的url端口： " + document.location.port + " <p> " );
             // 设置新的location 
             //document.location.href= " http://www.baidu.com " ;
             window.open('http://www.baidu.com');
          </script>
     </body>
 </html>

运行后，打印结果是：

document.location使用举例

当前位置： http://localhost/yacol/js/document.html

当前位置的url路径： /yacol/js/document.html

当前位置的url协议： http:

当前位置的url端口：

　　　　　document.location.href= " http://www.baidu.com " ;//转到百度
            window.open('http://www.baidu.com');//在新窗口打开百度

 

 

 

weixin_34306676
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Document.location
zq9955的博客
10-15 3801
Document.location 是一个只读属性，返回一个 Location 对象，包含有文档的 URL 相关的信息，并提供了改变该 URL 和加载其他 URL 的方法。 尽管 Document.location 是一个只读的 Location 对象，你也能够赋给它一个 DOMString。这意味着你能够赋给 document.location 字符串，大多数情况下像这样使用：document.location = ‘http://www.example.com’，也可写为document.locatio
document.location
songxiuliang的专栏
03-29 1461
document.location="url";(只读) document.location.reload("url";); window.location="url"; location="url"; document.href="url" document.location.href="url" document.location.replace="url" document.a
document.location和window.location有什么区别就是
qq_36825145的博客
01-31 654
document.location和window.location
如何用JS得到当前页面的URL信息
08-03 433
URL即:统一资源定位符 (Uniform Resource Locator, URL) 完整的URL由这几个部分构成： scheme://host:port/path?query#fragment scheme:通信协议 常用的http,ftp,maito等
javascript中的window.location和document.location 当前URL的信息
AS_TS的博客
09-17 2228
document.location 这个对象包含了当前URL的信息 location.host 获取port号 location.hostname 设置或获取主机名称 location.href 设置或获取整个URL location.port设置或获取URL的端口号 location.search 设置或获 document.location 这个对象包含了当前URL的信息 location.host 获取port号 location.hostname 设置或获取主机名称 location.hre
JavaScript中window.open用法实例详解
12-10
下面我们将详细探讨`window.open()`的使用方法及其相关参数。 `window.open()`的基本语法如下： ```javascript window.open(url, name, features); ``` - `url`：这是一个必需的参数，表示要打开的网页URL。 - `...
jquery.cookie.js用法实例详解
11-23
`jquery.cookie.js` 的使用非常直观，下面我们将详细解释其主要功能和用法。 1. **获取Cookie值**： 使用 `$.cookie('key')` 可以获取名为 'key' 的Cookie的值。例如： ```javascript var value = $.cookie('the...
浅析location.href跨窗口调用函数
09-01
篇文章主要探讨了如何使用`location.href`在不同的窗口和iframe之间进行跳转，以及相关的JavaScript属性和方法。`location.href`是JavaScript中的一个重要属性，它允许我们获取当前页面的URL或者设置新的URL来实现...
Nodejs+Socket.io实现通讯实例代码
10-20
- **服务端广播**：服务端可以使用`socket.broadcast.emit()`方法向所有连接的客户端（除了发送事件的客户端）广播消息。 ### 4. 服务端代码详解 在`server.js`中，首先引入`express`和`socket.io`模块，然后创建一...
js确认框confirm()用法实例详解.docx
01-21
本文将详细介绍 confirm() 函数的用法实例，包括其基本语法、返回值、参数等内容，并提供多种使用方法的实例代码。 confirm() 函数的基本语法 ------------------------ confirm() 函数的基本语法如下所示： `if ...
Location 对象，URL 对象，URLSearchParams 对象
油墨香^-^的博客
06-10 1124
作者 | 阮一峰 URL 是互联网的基础设施之一。浏览器提供了一些原生对象，用来管理 URL。 1、Location 对象 Location对象是浏览器提供的原生对象，提供 URL 相关的信息和操作方法。通过window.location和document.location属性，可以拿到这个对象。 1.1、属性 Location对象提供以下属性。 Location.href：整个 URL。 Location.protocol：当前 URL 的协议，包括冒号（:）。 L
JS之location对象详解
热爱前端的大三在校生
09-26 7636
location指示了其所连接对象的url位置。和对象中都有location属性，可以通过window.location和document.location访问。如果想要获得当前文档的完整url字符串，有四种方式以上方式均可以获得“”这样的字符串location在控制台输出结果为：（Chrome浏览器）
JavaScript window 、Document 、Location、History、Navigator，页面刷新方式汇总
蚩尤后裔-汪茂雄
11-28 1845
目录 Location 对象 Location 对象属性 host/hostname/port href 属性 Location 对象方法 reload() 方法 Location 对象 Location 对象包含当前 URL 的有关信息。 Location 对象是 Window 对象的一个部分，可通过 window.location 属性来访问。 Location 对象属性 ...
document文档对象，location位置对象
在职可交流前端开发，包括：web端、uniapp等，欢迎指教。
05-22 906
document、window、location、navigator、screen对象
location document 对象及属性
sjpwds的博客
05-27 507
一：location对象        1.  location对象的属性            host    设置或返回主机名和当前URL的端口号            hostname   设置或返回当前URL的主机名            href     设置或返回完整的URL      2.location对象的方法       reload()   重新加载当前文档
location对象
南乔几经秋、的博客
01-29 1315
location指示了其所连接对象的url位置。Document和window对象中都有location属性，可以通过window.location和document.location访问。 如果想要获得当前文档的完整url字符串，有四种方式     document.location     document.location.href     document.URL     documen...
html 获取location,html中location的用法详解
weixin_35647799的博客
06-08 1733
【转自】https://blog.csdn.net/py941215/article/details/77825921Location介绍location指示了其所连接对象的url位置。Document和window对象中都有location属性，可以通过window.location和document.location访问。注意 如果想要获得当前文档的完整url字符串，有四种方式document...
JAVASCRIPT中的window.location和document.location
小乐乐
01-18 738
  document.location     这个对象包含了当前URL的信息 location.host 获取port号 location.hostname 设置或获取主机名称 location.href 设置或获取整个URL location.port设置或获取URL的端口号 location.search     设置或获取href属性中跟在问号后面的部分 一、js中window.locat...
document.location对象学习
大龄python业余爱好者锅大虾
08-05 400
js的DOM操作基于document对象，location是常用的一个。打开控制台的console界面，调用location对象，看看有什么属性和方法 Location {href: "https://www.w3school.com.cn/jsref/dom_obj_document.asp", ancestorOrigins: DOMStringList, origin: "https://www.w3school.com.cn", protocol: "https:", host: "www.w3sc
new Vue({ el: '#app', data:{ self : '', userName : '' }, created:function (){ // console.log('页面打开了......') self = this; this.userName = getQueryString('userName'); console.log(this.userName); this.load(); //发送 post 请求 }, methods: { goout : function (){ window.location.href = 'login.html';//跳转页面 }, displayMethod : function (index){ var btnss = document.getElementsByClassName('itemss'); for(var i=0; i<btnss.length; i++){ var btn = btnss[i]; btn.style.background = '#6B05A5'; } btnss[index-1].style.background = '#6B05A5'; }, load: function (){ } } })代码详细解释
最新发布
06-08
以上是一个使用 Vue.js 框架构建的前端页面的代码，主要实现了页面元素的绑定、数据的加载和事件的绑定等功能。下面对其中的代码进行详细解释： ``` new Vue({ el: '#app', // 绑定 Vue 实例到 HTML 元素 #app 上 data: { // 定义 Vue 实例中的数据 self: '', userName: '' }, created: function() { // 在 Vue 实例创建时执行的函数 self = this; // 将 Vue 实例保存到 self 变量中 this.userName = getQueryString('userName'); // 获取 URL 中的 userName 参数并保存到 Vue 实例的 data 属性中的 userName 中 console.log(this.userName); this.load(); // 调用 load 方法加载数据 }, methods: { // 定义 Vue 实例中的方法 goout: function() { // 定义跳转页面的方法 window.location.href = 'login.html'; }, displayMethod: function(index) { // 定义切换按钮样式的方法 var btnss = document.getElementsByClassName('itemss'); for (var i = 0; i < btnss.length; i++) { var btn = btnss[i]; btn.style.background = '#6B05A5'; } btnss[index - 1].style.background = '#6B05A5'; }, load: function() { // 定义数据加载方法 // 在这里调用接口或者发送请求，加载数据 } } }) ``` 以上代码中，`data` 属性用于定义 Vue 实例中的数据，`created` 方法用于在 Vue 实例创建时执行一些初始化操作，`methods` 属性用于定义 Vue 实例中的方法。其中，`goout` 方法用于跳转页面，`displayMethod` 方法用于切换按钮样式，`load` 方法用于加载数据。在 `created` 方法中，通过调用 `getQueryString` 函数获取 URL 中的参数值，然后将其保存到 Vue 实例的 `userName` 属性中，以便在页面中使用。 总的来说，以上代码实现了一个简单的 Vue.js 页面，包含了数据绑定、事件绑定和方法定义等功能，可以通过调用接口或者发送请求来加载数据，实现前端页面的交互效果。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值