javascript获取url信息的常见方法

news2025/1/23 4:07:03

1、获取页面完整的url

1

2

var a=location.href;

console.log(a); // “http://www.cnblogs.com/wuxibolgs329/p/5261577.html#flag?test=12345”

2、获取页面的域名

var host = window.location.host;  //www.cnblogs.com

var host2 = document.domain;  //www.cnblogs.com

var a = location.hostname;  //www.cnblogs.com

3、获取url协议

var a=location.protocol;
console.log(a); //http:

4、获取端口

var a=location.port;
console.log(a);

5、获取页面路径

var a=location.pathname;
console.log(a);

6、设置或获取 URL 的协议部分

var a = location.protocol;

7、获取#后的部分

var a=window.location.hash; 
var b=a.substr(1); 
console.log(b); // flag?test=12345

8、获取 href 属性中跟在问号?后面的部分

// 此时案例地址变为“http://www.cnblogs.com/wuxibolgs329/p/5261577.html?test=12345”。得到 test=12345

var a=location.search;
var b=a.substr(1);
console.log(b); 

//如果案例依旧是“http://www.cnblogs.com/wuxibolgs329/p/5261577.html#flag?test=12345”,则需下面的写法,得到 test=12345
var a=location.href;
var b=a.substr(a.lastIndexOf('?')+1);
console.log(b);

9、获取 = 号后面的部分

var a=location.href;
var b=a.substring(a.lastIndexOf('=')+1);
console.log(b); // 12345

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/408271.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

学生管理系统Element UI版

💂 个人主页: 陶然同学🤟 版权: 本文由【陶然同学】原创、在CSDN首发、需要转载请联系博主💬 如果文章对你有帮助、欢迎关注、点赞、收藏(一键三连)和订阅专栏哦💅 想寻找共同成长的小伙伴,请点击【Java全栈开发社区】…

微前端 - qiankun

前言 qiankun 是一个基于 single-spa 的微前端实现库,旨在帮助大家能更简单、无痛的构建一个生产可用微前端架构系统。 本文主要记录下如何接入 qiankun 微前端。主应用使用 vue2,子应用使用 vue3、react。 一、主应用 主应用不限技术栈,只需…

前后端分离式交互

目录 前言 1.javaEE环境安装 第一步:正常创建javase项目 第二步:右击项目,引入框架支持 第三步:将项目部署到Tomcat服务器上。Tomcat安装及配置 2.servlet搭建 请求格式为:ip:端口/项目名/servlet地址 3.servl…

uniapp -- 扫码记录(针对app场景)

背景 扫码需求日益增多,为了满足客户的需求,扫码演变的多种多样,其中有二维码,条形码居中,条形码又可以细分成几种,以下记录全屏和自定义页面扫码的在uniapp的技术实现 全屏扫码 uniapp自身带的api方法-uni.scanCod…

vscode的vue代码提示与补全没反应(vetur问题)

问题:vscode的里面写vue时候代码提示用不了了 问题原因:vetur这个插件升级了,与老版本的vscode不适配了 解决方案: 1.卸载vscode,与vscode官网下载最新版本vscode 2.安装老版本的vetur(感谢评论区另一个大佬推荐的…

刷题日常计~JS③

作者 : SYFStrive 博客首页 : 点击跳转HomePage 📜: 初编程JavaScript之每天10题 👉 从质变到量变💪 📌:个人社区(欢迎大佬们加入) 👉:社区链接&#x1f5…

关于WEB-INF目录及Tomcat部署方式、原理的简单理解

个人学习所用,有不足或错误之处欢迎指正和补充! 目录 前言: 一、WEB-INF目录与META-INF目录 1. Web应用程序的目录结构 2. WEB-INF简介 3. WEB-INF的作用 4. 静态资源的访问 二、Tomcat部署本地工件 1. war和war exploded的区别 2.…

【HTML小游戏】推箱子网页版(附完整源码)

最近刚刚更新完了HTML,CSS的万字总结,有很多人已经学习完了文章,感觉反馈还不错,今天,用HTML,CSS,JS的知识编写了一个童年经典游戏 - 推箱子,供学习参考。 文章目录 1. 效果展示2. 游戏介绍3. 游戏规则4. 源码学习1. 效果展示 游戏主界面展示: 游戏界面展示: 2. 游戏…

ECMAScript6新特性【数组扩展(扩展运算符、新增方法一、新增方法二、新增方法三)】(四)-全面详解(学习总结---从入门到深化)

👏作者简介:大家好,我是小童,Java开发工程师,CSDN博客博主,Java领域新星创作者 📕系列专栏:前端、Java、Java中间件大全、微信小程序、微信支付、若依框架、Spring全家桶 &#x1f4…

【vue2】vuex的安装、配置与使用

一、前言 使用vuex可以实现数据的共享。 二、安装 vscode中新建终端安装vuex。由于vue2不能使用vuex4的版本,所以在安装时需要指定版本3 npm i vuex3 三、vuex工作流 vuex核心包括actions、mutations、state。 ①state用来存储数据; ②actions用…

vue+element-ui

一.使用图形化界面,创建vue项目 vue ui(在根目录下,打开cmd,启动图形化界面) 添加插件 添加element-ui插件 这里选择import on demand 安装好了 添加依赖 添加axios依赖 添加好了 二.创建Git仓库,连接并上传刚刚创建的项目 在项目文件目录下…

基于微信小程序的电影订票系统设计与实现(代码+数据库+论文)

项目简介 本系统是基于微信小程序的电影订票系统的设计与实现。基于B/S架构模式进行设计,使用了JavaScript、CSS、java语言等,后台数据库设计使用Mysql。本电影订票系统主要分为前端小程序订票系统和后台电影管理两部分。用户使用时接触的是系统前端小程…

学习Canvas基础-绘制矩形

学习Canvas基础-绘制矩形 canvas提供了三个API,分别是: 1.绘制矩形 rect(起点X, 起点Y, 绘制的矩形width, 绘制的矩形height) 但该方法不会出实际效果,需要配合 fill()和stroke()方法让其显现…

深入理解CSS之flex精要之 flex-basis flex-grow flex-shrink 实战讲解

这篇文章对flex不熟也可以看。这篇文章只讲这三个属性。为了简单化,不会提到主轴交叉轴,也不讲方向,默认方向就是水平方向从左往右。但并不影响对这三个概念的理解。 如果你觉得对flex比较了解,可以直接从第二小节开始看起。 1.…

window.print() 前端页面打印与预览PDF

window.print()打印是浏览器自带的打印,实现原理是将html转换为pdf可以在线预览打印或者导出pdf,在任何网页上可通过Ctilp快捷键调出浏览器打印程序,它可将整个网页打印出来,在我们开发中,其实并不需要将所有页面打印出…

js调用gpt3.5

参考链接&#xff1a;直接在前端调用 GPT-3 API 效果图&#xff1a; 小技巧&#xff1a; 1. shiftenter是发送消息的快捷键 2. 有本地聊天记录功能 3. 按delete按钮可以删除包括这条之后的记录 <!DOCTYPE html> <html><head><meta charset"UTF-8&…

前端插件库之vue3使用vue-codemirror插件

vue3插件vue-codemirror使用步骤和实例vue-codemirror使用配置说明:个人代码编辑区Demovue-codemirror 基于 CodeMirror &#xff0c;适用于 Vue 的 Web 代码编辑器。 使用 1.命令行安装 npm install vue-codemirror --save // cnpm install vue-codemirror --save如果运行…

vue3使用viewer

介绍 v-viewer是一款基于viewer.js的强大的插件&#xff0c;不但支持vue3版本&#xff0c;还支持vue2、JavaScript、jquery&#xff0c;有以下特点&#xff1a; 支持移动设备触摸事件支持响应式支持放大/缩小支持旋转&#xff08;类似微博的图片旋转&#xff09;支持水平/垂直…

idea / eclipse 配置 Tomcat 并发布 Web 项目

文章目录tomcat 安装配置简介下载安装系统环境配置优化配置修改默认内存管理员用户名和密码设置支持中文文件名称idea 配置 tomcat 并发布 web 项目项目创建为项目添加 tomcat发布测试eclipse 配置 tomcat 并发布 web 项目引入 tomcat建立 web 项目发布测试总结本篇内容主要讲述…

python Web开发 flask轻量级Web框架实战项目--实现功能--账号密码登录界面(连接数据库Mysql)

ps&#xff1a;各位好久不见&#xff0c;我回家了&#xff01;终于有时间把之前的一些东西整理一下了&#xff08;好吧&#xff0c;之前是我太懒了&#xff09;&#xff0c;今天分享一个功能简单的python web实战项目&#xff0c;后期功能可自行丰富。 先看效果 输入正确用户名…