当前位置: 首页 > news >正文

纯html页面中js如何获得项目路径

js,全称javascript,不过虽然是以java开头,不过与java一点关系都没有。

js和java有如下区别:

(1)js是浏览器端的语言,而java是服务器端的语言。

(2)js是动态语言,java是静态语言。

(3)java是基于面向对象的编程语言,而js虽有对象这个概念,但是只是基于对象而不能直接继承;

这里要提一点动态和静态是什么意思?

简单的说,动态就是不需要编译就能执行,而静态需要编译执行。

现在比较流行的就是前后端分离,如果用纯html开发+js获取后台数据,那么路径又怎么获得的呢?

既然是浏览器,那不得不提一个web开发最基础也最重要的东西,HTTP协议。

这里我要引用一位朋友的话:

HTTP请求具有如下特点:

(1)简单快速:客户向服务器请求服务时,只需传送请求方法和路径。请求方法常用的有GET、HEAD、POST。每种方法规定了客户与服务器联系的类型不同。由于HTTP协议简单,使得HTTP服务器的程序规模小,因而通信速度很快。

(2)灵活:HTTP允许传输任意类型的数据对象。正在传输的类型由Content-Type加以标记。

(3)无连接:无连接的含义是限制每次连接只处理一个请求。服务器处理完客户的请求,并收到客户的应答后,即断开连接。采用这种方式可以节省传输时间。

(4)无状态:HTTP协议是无状态协议。无状态是指协议对于事务处理没有记忆能力。缺少状态意味着如果后续处理需要前面的信息,则它必须重传,这样可能导致每次连接传送的数据量增大。另一方面,在服务器不需要先前信息时它的应答就较快。
(5)支持B/S及C/S模式。

 

这里还不得不提一个概念:

HTTP请求中的URL

 

HTTP使用统一资源标识符(Uniform Resource Identifiers, URI)来传输数据和建立连接。URL是一种特殊类型的URI,包含了用于查找某个资源的足够的信息

URL,全称是UniformResourceLocator, 中文叫统一资源定位符,是互联网上用来标识某一处资源的地址。以下面这个URL为例,介绍下普通URL的各部分组成:

http://www.yc520.com:8080/news/index.asp?boardID=5&ID=24618&page=1#name

从上面的URL可以看出,一个完整的URL包括以下几部分:
(1)协议部分:该URL的协议部分为“http:”,这代表网页使用的是HTTP协议。在Internet中可以使用多种协议,如HTTP,FTP等等本例中使用的是HTTP协议。在"HTTP"后面的“//”为分隔符

(2)域名部分:该URL的域名部分为“www.yc520.com”。一个URL中,也可以使用IP地址作为域名使用

(3)端口部分:跟在域名后面的是端口,域名和端口之间使用“:”作为分隔符。端口不是一个URL必须的部分,如果省略端口部分,将采用默认端口

(4)虚拟目录部分:从域名后的第一个“/”开始到最后一个“/”为止,是虚拟目录部分。虚拟目录也不是一个URL必须的部分。本例中的虚拟目录是“/news/”

(5)文件名部分:从域名后的最后一个“/”开始到“?”为止,是文件名部分,如果没有“?”,则是从域名后的最后一个“/”开始到“#”为止,是文件部分,如果没有“?”和“#”,那么从域名后的最后一个“/”开始到结束,都是文件名部分。本例中的文件名是“index.asp”。文件名部分也不是一个URL必须的部分,如果省略该部分,则使用默认的文件名

(6)锚部分:从“#”开始到最后,都是锚部分。本例中的锚部分是“name”。锚部分也不是一个URL必须的部分

(7)参数部分:从“?”开始到“#”为止之间的部分为参数部分,又称搜索部分、查询部分。本例中的参数部分为“boardID=5&ID=24618&page=1”。参数可以允许有多个参数,参数与参数之间用“&”作为分隔符。

 

下面我们进入正题,如何通过js获取项目路径?

如下js代码即可获取:

/**
 * 项目路径
 */

window.οnlοad=function(){
    getPath();
}

function getPath(){

    var pathName = document.location.pathname;
    var index = pathName.substr(1).indexOf("/");
    var result = pathName.substr(0,index+1);
    $("#path").val(result);


}

 

关于js这部分,我将在后续写一个连载系统篇为大家详细介绍和讲解js。一来分享心得,二来总结。

 

相关文章:

  • Confluence 6 后台中的选择站点首页
  • 算法18-----判断是否存在符合条件的元素【list】
  • 邪恶的三位一体:机器学习、黑暗网络和网络犯罪
  • sql查询本周,本月数据
  • 生产环境Vmware新增硬盘扩展VG并新建文件系统
  • 通过7个函数解密区块链(附代码)
  • php面试题三
  • CISP-PTE注册信息安全专业人员渗透测试工程师知识体系大纲
  • kafa单机版环境搭建
  • MYSQL如何对数据进行自动化升级--以如果某数据表存在并且某字段不存在时则执行更新操作为例...
  • 100 个网络基础知识普及(上)
  • shell脚本学习
  • 腾讯云工业互联网助力平台发布 推动制造业“数字化”蝶变
  • Shell编程
  • node 基础与 Event Loop
  • 2017 前端面试准备 - 收藏集 - 掘金
  • Angular 响应式表单 基础例子
  • dva中组件的懒加载
  • WinRAR存在严重的安全漏洞影响5亿用户
  • 简析gRPC client 连接管理
  • 前端性能优化——回流与重绘
  • 如何进阶一名有竞争力的程序员?
  • 如何学习JavaEE,项目又该如何做?
  • 用Python写一份独特的元宵节祝福
  • 用Visual Studio开发以太坊智能合约
  • 【运维趟坑回忆录 开篇】初入初创, 一脸懵
  • 教程:使用iPhone相机和openCV来完成3D重建(第一部分) ...
  • #laravel 通过手动安装依赖PHPExcel#
  • #每天一道面试题# 什么是MySQL的回表查询
  • (C语言)编写程序将一个4×4的数组进行顺时针旋转90度后输出。
  • (day6) 319. 灯泡开关
  • (echarts)echarts使用时重新加载数据之前的数据存留在图上的问题
  • (ZT)北大教授朱青生给学生的一封信:大学,更是一个科学的保证
  • (安卓)跳转应用市场APP详情页的方式
  • (附源码)springboot 智能停车场系统 毕业设计065415
  • (一)使用Mybatis实现在student数据库中插入一个学生信息
  • (原创)boost.property_tree解析xml的帮助类以及中文解析问题的解决
  • ***微信公众号支付+微信H5支付+微信扫码支付+小程序支付+APP微信支付解决方案总结...
  • ***详解账号泄露:全球约1亿用户已泄露
  • .so文件(linux系统)
  • @ResponseBody
  • [BZOJ2281][SDOI2011]黑白棋(K-Nim博弈)
  • [CSS3备忘] transform animation 等
  • [GN] DP学习笔记板子
  • [IE9] IE9 beta版下载链接
  • [JavaEE]线程的状态与安全
  • [Linux]使用CentOS镜像与rpm来安装虚拟机软件
  • [Linux基础开发工具---vim]关于vim的介绍、vim如何配置及vim的基本操作方法
  • [Luogu P3527BZOJ 2527][Poi2011]Meteors(整体二分+BIT)
  • [Machine Learning][Part 8]神经网络的学习训练过程
  • [MySQL]日期和时间函数
  • [NSSRound#16 Basic]RCE但是没有完全RCE
  • [RISCV] 为android14添加一个新的riscv device
  • [Rust] 快速基础入门教程
  • [Silverlight]通过MVVM模式实现本地化/全球化(1)