根据随机 CSS 文件生成文本

Question

我的网页有一个随机的 CSS function 可以正常工作：

 <link rel="stylesheet" href="/css/<?php echo(mt_rand(1,7));?>.css" />

但我希望根据选择的 CSS 文件显示文本。 每一个都有一个与之关联的名称，因此对于“Copenhagen”CSS 工作表，我希望它显示文本“此样式表称为 Copenhagen”。

现在我正在尝试 output 文本基于.skills-title的背景颜色，目前是黑色、白色或其他所有颜色（“失败”）。 但是它根本不输出任何东西。 我认为这是因为样式表是随机的，所以我不能在代码中调用特定的样式表。

 var color = $('.skills-title').css('background-color'); if (color == 'rgb(255, 255, 255)') { document.write("Copenhagen"); } else if (color == 'rgb(0, 0, 0)') { document.write("Paris"); } else { document.write("Fail"); }

在玩了很多不同的代码几个小时后，我感到卡住了。

Answer 1

您可以尝试为您的 Link 标签设置一个id或title ，这样您就可以在 vanilla js 中获取它，如下所示：

// supposing you created it like: <link id="mylink" title="mylinktitle" rel="stylesheet" href="/css/<?php echo(mt_rand(1,7));?>.css" />

let element = document.querySelector("link[title=mylinktitle]")

// or 

let element = document.getElementById("mylink");

使用元素 object，您可以检查任何内容并显示您想要的名称。

或者，您可以尝试在标题中发送名称并使用 static id，这样您就可以根据某个 id 获取元素并显示相关联的标题