javascript - 如何在javascript中获取基本url

Question

我正在用 CodeIgniter 建立一个网站，我有各种资源，我用 base_url 加载像这样的辅助函数

<link rel="stylesheet" type="text/css" href="'.base_url('assets/css/themes/default.css').'" id="style_color"/>

产生(即 www.mysite.com)

<link rel="stylesheet" type="text/css" href="http://www.mysite.com/assets/css/themes/default.css" id="style_color"/>

然后我可以像这样在 javascript 中将此资源与另一个资源交换

$('#style_color').attr("href", "assets/css/themes/" + color_ + ".css");

发生的事情是它会尝试在不使用 php 生成的绝对路径的情况下加载资源，所以我的解决方案是在每个带有 php 的页面中添加一个虚拟标签，就像这样

<div id="base_url" class="'.base_url().'"></div>

然后我将 javascript 行修改为

$('#style_color').attr("href", $('#base_url').attr("class") + "assets/css/themes/" + color_ + ".css");

它确实有效，但它看起来一点也不优雅，因此，我将不胜感激任何有关如何从 javascript 或任何其他解决方案中生成此基本 url 的帮助，谢谢 :)

---

我更喜欢仅使用 Javascript 的解决方案，因为我使用的是 CodeIgniter , 一个 document.base_url来自 protocol 的 url 段的变量到 index.php似乎很方便

document.base_url = base_url('index.php');

函数base_url()存在

function base_url(segment){
   // get the segments
   pathArray = window.location.pathname.split( '/' );
   // find where the segment is located
   indexOfSegment = pathArray.indexOf(segment);
   // make base_url be the origin plus the path to the segment
   return window.location.origin + pathArray.slice(0,indexOfSegment).join('/') + '/';
}

Answer 1

JavaScript 中的基本 URL

您可以使用 window.location

在 JavaScript 中轻松访问当前 url

您可以通过此 locations 对象访问该 URL 的各个部分。例如:

// This article:
// https://stackoverflow.com/questions/21246818/how-to-get-the-base-url-in-javascript

var base_url = window.location.origin;
// "http://stackoverflow.com"

var host = window.location.host;
// stackoverflow.com

var pathArray = window.location.pathname.split( '/' );
// ["", "questions", "21246818", "how-to-get-the-base-url-in-javascript"]

在 Chrome 开发工具中，您只需在控制台中输入 window.location，它就会返回所有可用的属性。

---

更多信息请访问 this Stack Overflow thread