我正在使用外部数据制作一个漂亮的简单 html 页面......这是让我感到悲伤的一点：
<section class="faq_main">
{% for section in faq.sections %}
<h3>{{ section.heading }}</h3>
{% for question in section.questions %}
<article class="faq_question">
<a id="hide_{{ section.code }}_{{ question.code }}"
href="#hide_{{ section.code }}_{{ question.code }}"
class="hide"><span class="faq_toggler">+</span> {{ question.question }}</a>
<a id="show_{{ section.code }}_{{ question.code }}"
href="#show_{{ section.code }}_{{ question.code }}"
class="show"><span class="faq_toggler">-</span> {{ question.question }}</a>
<div class="details">
{{ question.answer }}
</div>
</article>
{% endfor %}
<p> </p>
{% endfor %}
</section>
...和匹配的faq.json文件：
{
"sections" : [
{ "heading" : "Section the first",
"code" : "gn",
"questions" : [
{
"question": "What do questions need?",
"code" : "1",
"answer": "An answer"
},
{
"question": "Is this also a question?",
"code" : "2",
"answer": "Yes, it is"
},
{
"question": "Is this junk data?",
"code" : "a",
"answer": "Yes"
},
]
},
{
"heading": "Another section",
"code" : "f",
"questions": [
{
"question": "Can I have html in my answer?",
"code" : "2",
"answer": "<ul>\n<li>First, json needs newlines escaped to be newlines</li>\\n<li>Eleventy seems to 'sanitize' the string</li>\\n</ul>"
},
{
"question": "question b",
"code" : "b",
"answer": "answer b"
},
{
"question": "question c",
"code" : "or",
"answer": "answer c"
},
]
}
]
}
....问题答案的呈现文本是：
<ul> <li>First, json needs newlines escaped to be newlines</li>\n<li>Eleventy seems to 'sanitize' the string</li></ul>
我在这里有什么选择吗？有没有办法允许 [甚至是] html 元素的子集进入页面？
（是的，CSS 使用 '+'/'-' 符号巧妙地显示/隐藏描述 - 事情的所有方面都很可爱）