Question

我正试图让我的页面上的文字随机点击显示颜色和字体。颜色正在工作，但我无法改变字体。控制台告诉我代码正在运行，但它没有显示。

$(document).ready(function(){
  $('.header').click(function() { 
    $(".header").toggleClass("headerChange");
    var color = randmColor();
    $(".header").css("color", color);

    var fontType = [ "Lily Script One", "Monoton"];
    $(".header").css("fontfamily", fontType[Math.floor(Math.random()*2)]);
  });

CSS：

@import url('https://fonts.googleapis.com/css?family=Josefin+Slab');
@import url('https://fonts.googleapis.com/css?family=Lily+Script+One');

我认为这是它调用CSS的方式，但我是新编码和难倒的。

Answer 1

你在"font-family"错过了一次宣传。只需更改倒数第二行：

$(".header").css("font-family", fontType[Math.floor(Math.random()*2)]);

更改"font-family"属性的问题已经描述here。

当然，您还应确保通过<link>标记将HTML文件链接到HTML中。

Answer 2

在您的HTML中，您需要确保：

    <style>
    @import url('https://fonts.googleapis.com/css?family=Lily+Script+One'); 
    </style>
    <style>
    @import url('https://fonts.googleapis.com/css?family=Josefin+Slab');
    </style>

你赢得的CSS并没有设置字体，它只是以你拥有的默认字体开始，然后用你的javascript改为随机字体。

点击

2 个答案: