首页 > 解决方案 > 不使用innerText直接将文本添加到innerHTML

问题描述

是否可以在innerHTML无需使用的情况下添加字符串innerText

像这样:

var sentence="<b>hello there</b>";

document.querySelector(".container").innerHTML='<span class="thing"></span>';
document.querySelector(".thing").innerText=sentence;
<!DOCTYPE html>
<html>

  <head></head>

  <body>
  <div class="container"></div>
 
  </body>

</html>

但不必使用innerText
也许代码看起来像这样:

var sentence="<b>hello there</b>";

document.querySelector(".container").innerHTML='<span class="thing">'+raw(sentence)+'</span>';

标签: javascripthtml

解决方案


我认为您目前的方法没有任何严重问题。如果您想避免重复创建具有特定类的元素,然后必须在附加它后立即再次选择它,您可以考虑创建一个元素而不是 HTML 字符串:

var sentence="<b>hello there</b>";

document.querySelector(".container")
  .appendChild(document.createElement('span'))
  .textContent = sentence;
<div class="container"></div>


推荐阅读