Javascript 根据页面的协议加载css

我在同一个css文件中有2个@font-face

@font-face {
    /* code for https://site.con */
    }
@font-face {
        /* code for http://site.con */
    }

当站点是https时，我只需要加载第一个@font-face，当站点是http时，我只需要加载第二个@font-face

---

可能吗？使用js/jquery或其他方法？

您可以使用javascript/jquery执行此操作，解决方案步骤：

检查站点是否为https

加载正确的字体

$（“head”）.prepend（“+
“@font-face{\n”+
“\t字体系列：\“myFont\”；\n”+
“\tsrc:local（'☺'), url（'myFont.otf'）格式（'opentype'）；\n“+
“}\n”+
“\tp.myClass{\n”+
“\t字体系列：myFont！重要；\n”+
“}\n”+
"");

这两个规则之间的区别到底是什么？如果你这样做是因为混合内容错误，你可以同时使用https。@MarcBarbeau是的，我有一个混合内容错误，但我正在使用https和https这两个网站。如果规则之间的唯一区别是

http

和

https

，那么你的css r你的URL/path/file.ext将使用该页面当前使用的任何协议。你不能在不定义https或http的情况下使用

//font.googleapis.com/css？family=Foo

？

if (location.protocol != 'https:')
{
//http font
} else {
//https font
}

$("head").prepend("<style type=\"text/css\">" + 
                                "@font-face {\n" +
                                    "\tfont-family: \"myFont\";\n" + 
                                    "\tsrc: local('☺'), url('myFont.otf') format('opentype');\n" + 
                                "}\n" + 
                                    "\tp.myClass {\n" + 
                                    "\tfont-family: myFont !important;\n" + 
                                "}\n" + 
                            "</style>");