时间戳

首页 > 解决方案 > 在 Jinja 模板中更改 h1 标签中某个部分的样式

javascript - 在 Jinja 模板中更改 h1 标签中某个部分的样式

问题描述

我在使用 JS 提取的 h1 标签中有一个问题，像这样......

var question = document.getElementsByTagName("h1");

如果问题 (h1) 包含“全部勾选”，我只希望“全部勾选”（而不是问题的任何其他部分）为绿色。于是我就这样开始了...

if ($("question:contains('tick all')").length) {

};

但我不确定如何进一步编码。请帮忙

在我的 HTML 文件中，我有以下 Jinja 模板代码...

<h1>{{ question_text }}</h1>

标签： javascriptjqueryhtmlcssjinja2

解决方案

如果你只有一个 h1 标签，那么你可以像下面这样使用

var ques = $('h1').text();
if(ques.indexOf('tick all') >= 0){
  ques = ques.replace("tick all","<span style='color:green'>tick all</span>");
  $('h1').html(ques);
}

对于多个 h1 标签，您可以 .each 函数，

$('h1').each(function(){
var ques = $(this).text();
    if(ques.indexOf('tick all') >= 0){
      ques = ques.replace("tick all","<span style='color:green'>tick all</span>");
      $(this).html(ques);
    }
}

推荐阅读