jQuery数组的样式输出

Style output of an jQuery array

本文关键字：输出 样式 数组 jQuery      更新时间：2023-09-26

我有一个包含许多语句/引号的数组，但我想添加一些自定义HTML来帮助在显示时设置每个引号的样式。

在下面的代码中，我已经演示了我想要做的事情，但目前实际的HTML标记是作为字符串输出的。我如何让他们呈现为HTML，所以我可以用CSS样式他们?

这里是一个工作小提琴显示我的意思:https://jsfiddle.net/tawasnng/1/

// Random testimonials headlines = new Array('Food was amazing and the drinks well-priced. We’ll be back soon!<span class="boom">Test</span>', "Bad", "Ugly", "Random Headline");    var randomNumberBefore = 4;
   function randomNumberByRange (range, number) {
      var r = Math.floor(Math.random() * (range-1));
      if(r >= number)r++;
      return r;    }
   $(document).on('click','.nextquote' , function() {
      var randomNumber = randomNumberByRange( headlines.length, randomNumberBefore);
      randomNumberBefore = randomNumber;
      var nextHeadline = headlines[randomNumber];
      $(".quote").text(nextHeadline);
   });

您需要使用.html()而不是.text()以使其输出为HTML。替换以下内容:

$(".quote").text(nextHeadline);

: 

$(".quote").html('<span class="headline">' + nextHeadline + '</span>');

试着给.headline班一些东西!

相关文章：