是否可以在用户重新加载页面时更改css文件?

时间:2017-05-14 22:56:05

标签: css

我想要的是我有4个css文件,我想在用户刷新页面时更改css文件。

<link href="assets/css/explorer-turquoise.css" rel="stylesheet" type="text/css">
    <link href="assets/css/explorer.css" rel="stylesheet" type="text/css">
    <link href="assets/css/explorer-red.css" rel="stylesheet" type="text/css">
    <link href="assets/css/explorer-blue.css" rel="stylesheet" type="text/css">

现在,只要没有点击任何按钮或链接进入我的网站的用户动态更改css文件。是否有可能实现它?

1 个答案:

答案 0 :(得分:0)

您可以使用Javascript。创建一个包含CSS文件名称的数组,从数组中选择一个随机名称,创建一个link标记并将href属性设置为随机名称,然后将其附加到页面头部。 / p>

<script>
var sheets = ['explorer-turquoise','explorer','explorer-red','explorer-blue'],
        randSheet = sheets[Math.floor(Math.random()*sheets.length)];

    var newSheet = document.createElement('link');
    newSheet.href = '/assets/css/' + randSheet + '.css';
    newSheet.rel = 'stylesheet';

    document.head.appendChild(newSheet);
</script>