CSS/JS中的动态URL

Question

我正在拆分我的一个较大的应用程序并引入一个'cdn'网址来存放常见的对象,如CSS,javascript和图像,以避免重复.但是,我需要做的是为我们的开发环境提供单独的URL,所以我可能有:

http://cdn-dev.example.com
http://cdn-qua.example.com
http://cdn.example.com

取决于我们正在使用什么环境.我可以使用它来处理由我们的PHP代码生成的内容,但我对将要调用的.css和.js文件感到茫然.例如,我如何制作如下内容:

.cool-button { background-image: url('http://cdn.example.com/images/button.png'); }

在不同的域之间切换？

处理这个问题的最佳方法是什么？

[编辑]

只是每个人都清楚,CDN地址是该网站的不同域名.因此,开发站点可能是http://www-dev.domain.com,它将使用http://cdn-dev.domain.com

Answer 1

使用相对路径,而不是绝对路径.在CSS文件中时,路径相对于CSS文件而不是HTML页面.

如果你的CSS文件在这里

http://cdn.example.com/css/style.css

你的班级是

.cool-button { background-image: url('../images/button.png'); }

然后浏览器将尝试从中加载图像

http://cdn.example.com/images/button.png

Answer 2

只需使用域名相对网址？

.cool-button { background-image: url('/images/button.png'); }

然后浏览器将查看当前域.