Question

是否可以引入id特定样式或加载不同的css文件，具体取决于你所在的“url”？

类似的东西：

<script>
 if(location.href == 'http://jpftest2.tumblr.com/about'){ 
document.write('<style type='text/css'>
.social {
  display:none;
}

</style>'); 
} 

</script>

所以当用户离开根网址到“/ about”页面时。我想介绍一下这种风格：

   .social {
  display:none;
}

如果根据URL可以完全加载不同的CSS文件，那么

会更好吗？

tumblr上的不同页面共享相同的头部，所以我不能在不同的页面上引入不同的CSS

Answer 1

假设您的网站使用的是AJAX（正确吗？），（否则您会将样式表放在文件的HTML <head>中），您可以这样：

window.onpopstate = function() {
    if(window.location.path == '/about'){ 
        var css = document.createElement('style');
        css.type = 'text/css';
        css.rel = 'stylesheet';
        css.innerHTML = '.social{display:none;}';
        document.getElementsByTagName('head')[0].appendChild(css);
    }
}

但我不推荐它。

Answer 2

您可以使用以下方法

<script type="text/javascript">
    $(document).ready(function(){

    if(your_url_condition){
            //for IE compatibility
            if (document.createStyleSheet){
                document.createStyleSheet('style.css');
            }
            else {
                $("head").append($("<link rel='stylesheet' href='style.css' type='text/css' media='screen' />"));
            }
        }
    });
</script>

这样可以帮助你。

问候！

使用jquery或其他东西根据URL加载不同的css文件

2 个答案: