包括相对于网站根的JS和CSS文件



我正在寻找包括CSS/JS文件的最佳实践,即文件URI。我看到人们通过给文件提供完整的URI来包含与网站根相对的文件:

<link rel="stylesheet" href="/my/path/to/css/main.css">

我倾向于这样做,因为当我阅读代码时,我发现更容易知道文件在哪里,而且我没有遇到任何问题。但我也看到了很多相对的包括:

<link rel="stylesheet" href="css/main.css">

你用哪种方式定义文件位置,为什么?一个比另一个好吗?

我更喜欢相对包含,因为它们对平台变化(例如从测试部署到实时平台)是稳健的,因为只要项目的内部结构没有改变,它们仍然可以工作,而在这种情况下,绝对路径可能会断开。此外,有时很难知道绝对路径,而相对的文档依赖路径非常明显。

然而,如果您在整个项目中的多个不同位置都有文件,那么每次都会有不同的相对路径(对于同一个文件,这可能会非常令人困惑),因此在这种情况下,绝对路径可能是首选路径(为了健壮性,您应该在变量或类似变量中使用webroot路径:$WEBROOT/css/main.css)。我想这一切都取决于你的个人需求。

在第一种情况下,URI是网站域的绝对。因此,URI应该是:

http://www.example.com/my/path/to/css/main.css

对于第二种方法,路径是相对于当前路径的。假设你现在在

http://www.example.com/store/product/121

那么css文件的路径将是:

http://www.example.com/store/product/css/main.css

因此,这取决于文件的位置。

最新更新