Question

这是我的HTML代码。

 <div id="ulgallery">
    <ul class="row">
      <li> some item1 </li>
      <li> some item1 </li>
      <li> some item1</li>
    </ul>
    <ul class="row">
      <li> some item2 </li>
      <li> some item2 </li>
      <li> some item2 </li>
    </ul>
  </div>

我有一个后台ajax程序，可以获取更多

 <ul> ...</ul> <ul> ...... </ul>

数据为字符串。我在最后一个元素之后附加此数据时遇到问题。

最终代码应如下所示：

 <div id="ulgallery">
    <ul class="row">
      <li> some item1 </li>
      <li> some item1 </li>
      <li> some item1</li>
    </ul>
    <ul class="row">
      <li> some item2 </li>
      <li> some item2 </li>
      <li> some item2 </li>
    </ul>
   <ul class="row">
      <li> some item3 </li>
      <li> some item3 </li>
      <li> some item3 </li>
    </ul>
   <ul class="row">
      <li> some item4 </li>
      <li> some item4 </li>
      <li> some item4 </li>
    </ul>
  </div>

这就是调用后台程序获取更多数据，这些数据应附加到最后一项。我不知道如何将字符串转换为节点

   document.getElementById("ulgallery").appendChild(node);

Answer 1

将获取的字符串设置为虚拟innerHTML元素的div。然后获取虚拟div的childNodes。这样就可以了。它会将字符串转换为DOM节点数组。然后只需遍历列表并将节点附加到父节点。

伪代码：

        var temp = document.createElement('div');
        temp.innerHTML = child; // child is the fetched string from ajax call in your case
        child = temp.childNodes;
        for(var i=0; i<child.length ; i++){
           parent.appendChild(child[i]); 
        }

在javascript中将字符串转换为Node元素

1 个答案: