代码推演
同一个字符串,为什么呈现不同?
<h3>A</h3><p id="a"></p>
<h3>B</h3><p id="b"></p>
<script>
const value = '<strong>小林</strong>';
document.querySelector('#a').textContent = value;
document.querySelector('#b').innerHTML = value;
</script>
提问:A、B 中哪一个创建了 strong 元素?如果 value 来自陌生用户,应优先选择哪一种,为什么不能只按显示效果决定?
查看参考解析
A 显示字面文本,B 解析并创建 strong 节点。未经信任的纯文本输入优先 textContent;innerHTML 是 HTML 解析入口,本例不执行恶意代码,但显示正常不能证明其对任意输入安全。