JS获取项目路径详解

写程序的时候在JS里面需要用到项目路径, 所以网上找了个例子, 然后看了下, 差不多如下.

function getRootPath() {    // 获取主机地址, 如: http://example.com:8080    var hostPath = document.location.origin;    /**     * 获取URL中路径部分.     *     * 假设当前的URL是: http://example.com:8080/project_name/test.html     * 返回: /project_name/test.html     */    var pathName = document.location.pathname;    /**********************获取项目名****************************/    var str = pathName.substr(1); // 返回: project_name/test.html    var index = str.indexOf('/'); // 获取/所在的位置.    /**     * 从 /project_name/test.html 截取项目名     * 这里加上1是因为index是在str的位置, 也就是在project_name/test.html中的位置     * 而这时候的截取是从/project_name/test.html这里开始的, 多了个长度, 所以要加上1.     */    var projectName = pathName.substring(0, index + 1);    /**     * 上面的三步可以直接这么写.     * var projectName = pathName.substring(0, pathName.substr(1).indexOf('/') + 1);     */    return hostPath + projectName;}

这段代码还是比较通用的, 看了下, 主要就是利用document.location.pathname; 获取路径地址, 然后截取出项目名.适用于下面2种情况:

1. 如果路径没有项目名: http://example:8080/test.html
   那么返回的是http://example:8080
2. 如果路径带了项目名: http://example:8080/project_name/test.html
   那么返回的是: http://example:8080/project_name

如果路径没有项目名时, 是这样的情况:

var str = pathName.substr(1); //这里获取到的是test.html var index = str.indexOf('/'); // 这里返回-1.var projectName = pathName.substring(0, index + 1); // 这里截取到的是空字符串.

而如果路径带了项目名, 我在上面代码注释里已经写了步骤介绍了过程. 这里就不再啰嗦了.

---

另外说一下, 网上的例子在获取主机路径的时候是这样的写法.

// 先拿到当前页面的地址.var currentPagePath = document.location.href;// 然后获取URL中路径部分.var pathName = document.location.pathname;// 接着根据pathName在整个路径中的位置截取获取到主机路径.var hostPath = currentPagePath.substring(0, currentPagePath.indexOf(pathName);

但是我debug的时候发现document.location里面有一个origin属性(但是查了国内w3c并没有这个属性的介绍), 这个属性值就是主机的路径. 所以省的我们自己计算了, 同时我也测试过在带项目路径和没有项目路径这2种情况下, origin属性都是可以拿到主机路径的.

英文的W3C Location对象介绍页面有Origin这个属性: http://w3schools.bootcss.com/jsref/prop_loc_origin.html