# Markdown中使用HTML标签

在Markdown中写html标签文本

<h1>这是一个标题</h1>
1

会被直接解析为字符串,标签不显示,

# 原因

网站为避免XSS攻击,例如React中无法在jsx中直接插入HTML(innerHTML)


// state
{
  html: '<div>Markdown</div>'
}

//render
<div>{this.state.html}</div>

编译后放在页面时:
<div>Markdown</div>
1
2
3
4
5
6
7
8
9
10
11

如果是网站本身的在JSX中直接插入HTML,使用的是dangerouslySetInnerHTML,操作Markdown

<div dangerouslySetInnerHTML={
  __html: "<div>这是一个标题</div>"
}></div>

// 页面显示为
这是一个标题
1
2
3
4
5
6

# 解决办法:

  • 方法一:用斜杠引号
`<h1>这是一个标题</h1>`
1
  • 方法二:对标签进行转义
&lt;h1&gt;这是一个标题&lt;/h1&gt;
1