WordPressleaf开发 使用JavaScript获取当前网页根目录

导语：在WordPressleaf主题中，一直直接定义了weixin.js中的图片imgurl。weixin.js是社交关注中用来展示微信公众号图片的JS代码。用来最近发现了一个问题，有些网友不熟悉代码，不知道将imgurl怎么改成自己的地址。所以，今天修正一下weixin.js，让它自动获取图片的imgurl，然后网友只需要替换图片/wp-content/themes/wordpressleaf/assets/images/weixin.png就可以了。

代码

function getRootPath_dc() {
            var pathName = window.location.pathname.substring(1);
            var webName = pathName == '' ? '' : pathName.substring(0, pathName.indexOf('/'));
            if (webName == "") {
                return window.location.protocol + '//' + window.location.host;
            }
            else {
                return window.location.protocol + '//' + window.location.host + '/' + webName;
            }
        };

代码解读

1. var pathName = window.location.pathname.substring(1);

   这行代码的作用就是截取掉window.location.pathname从首字母起长度为1的字符串，将剩余字符串赋值给pathName。

   用例子说明，我们现在打开网址：https://www.wordpressleaf.com/2016_792.html，那么window.location.pathname的值为：/2016_792.html。所以，这行代码中substring(1)的作用就是将‘/’去除掉。那么pathName为 2016_792.html。

2. var webName = pathName == ” ? ” : pathName.substring(0, pathName.indexOf(‘/’));

   这行代码的作用就是判断pathName是否为空，如果为空，将空值赋给webName，如果不为空，获取pathName中第一个‘/’前面的字符串。

   用例子说明，当我们打开网址：https://www.wordpressleaf.com时，pathName就是为空值的，那么webName的值就会为空。

   如果我们打开https://www.wordpressleaf.com/test/2016_792.html，那么pathName的值经过indexOf(‘/’)的处理就变成了test。

   pathName.substring(0, pathName.indexOf(‘/’))的意思就是，从头开始截取字符串，截取到第一个‘/’出现的位置为止。

   比如，我们在是本地搭建环境的时候，有可能用目录来区分不同的网站，例如，localhost/wp1，localhost/wp2，等等，这时候，网站的根目录其实是应该带目录名的。

3. return window.location.protocol + ‘//’ + window.location.host;

   这行的意思就是，返回网站带协议的访问域名，例如，window.location.protocol 为http:，window.location.host 为www.wordpressleaf.com，最后两种拼接，window.location.protocol + ‘//’ + window.location.host就等于https://www.wordpressleaf.com。

4. return window.location.protocol + ‘//’ + window.location.host + ‘/’ + webName;

   这行代码就是返回https://www.wordpressleaf.com加一个目录，例如，https://www.wordpressleaf.com/test。适用于一个域名下用不同的目录来区分不同的网站的情景。

说明

对于那种直接用域名做根目录的网站，那么要获取根目录其实只要return window.location.protocol + ‘//’ + window.location.host 这一行代码就可以获取网站根目录了。

其他的代码其实都是为一个域名下用不同的目录来区分不同的网站的场景准备的。

结束

你学会了吗？可能啰嗦了点，其实如果想明白了就很简单。本文引用代码为JavaScript获取当前根目录中的代码。