Question

目前，我使用静态 CSS 执行此操作时使用的内容类似于下面显示的代码。

#main-content > article.mh-loop-item.clearfix.post-95.post.type-post.status-publish.format-standard.has-post-thumbnail.hentry.category-singles.tag-kxngg-jxnes-italy > div > header > h3 > a {
color: blue;
}
#main-content > article.mh-loop-item.clearfix.post-93.post.type-post.status-publish.format-standard.has-post-thumbnail.hentry.category-singles.tag-aquil-eddie-guerrero > div > header > h3 > a {
color: red;
}

对于每个帖子ID ，它会为那些歌曲标题生成不同的颜色，但是我试图用Javascript做一些更高级的东西，或者什么时候有一个一个具有某个类的href，它会为该链接生成一个随机颜色，显示为。

Answer 1

可以通过jquery实现，如下所示

＆＃13;

$(document).ready(function(){
  
  $('body a').each(function(){
    var color = 'rgb(' + randomNumber() + ',' + randomNumber() + ',' + randomNumber() + ')';
    $(this).css("color", color);
  });
  
  function randomNumber(){
    return Math.floor(256*Math.random());
  }
  
});

＆＃13;

<a href="javascrip:void(0)">First link</a>
<a href="javascrip:void(0)">Second link</a>
<a href="javascrip:void(0)">Third link</a>
<a href="javascrip:void(0)">Fourth link</a>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

＆＃13;

Answer 2

类似这项工作，请试一试：

＆＃13;

/*I just hard coded everything*/
var yourClass = "article",
  hs = Array.from(document.querySelectorAll('a.' + yourClass)),
  colors = ['blue', 'red', 'green', 'purple', 'black', 'blue', 'yellow', 'lime'];

hs.forEach(function(elm) {
  elm.style.color = colors[Math.floor(Math.random() * colors.length)];
})

＆＃13;

<a href="#"> normal </a>

<a class="article" href="#"> title1 </a>
<a class="article" href="#"> title2 </a>
<a class="article" href="#"> title3 </a>
<a class="article" href="#"> title4 </a>

＆＃13;

Answer 3

好的，如果你真的想这样做（不明白为什么，但我喜欢它:-)）。然后我会告诉你一个方法。我会为此使用jquery，但随意即兴发挥。

创建或编辑您的javascript文件。然后继续（我假设您的帖子标题有名为postTitle的类）

$('.postTitle').each(function () {
    var red = Math.floor(Math.random() * 256);
    var green = Math.floor(Math.random() * 256);
    var blue = Math.floor(Math.random() * 256);
    $( this ).css("color", "rgb(" + red + "," + green + "," + blue + ")");
})

使我网站上的每个href都有不同的颜色

3 个答案: