如何将html字符串作为节点插入父元素

Question

比如有这样的一个html字符串

'<div style="width:12px; height:12px">text</div>'

要插入到

<div class="parent">
    <div>child</div>
</div>

结果要是这样

<div class="parent">
    <div style="width:12px; height:12px">text</div>
    <div>child</div>
</div>

Answer 1

  <div class="parent">
    <div>child</div>
  </div>
  <script type="text/javascript">
  var s = '<div style="width:12px; height:12px">text</div>';
  document.querySelector('.parent').insertAdjacentHTML('afterBegin',s);
  </script>

  <div class="divnode">
    <div>child</div>
  </div>
  <script type="text/javascript">
  var s = '<div style="width:12px; height:12px">text</div>';
  document.querySelector('.divnode').innerHTML = s + document.querySelector('.divnode').innerHTML;
  </script>

Answer 2

//给节点加类
<div class='child'>child</div>
$('.child').prepend('<div style="width:12px; height:12px">text</div>')