如何从字符串中写入每个字符以使用JavaScript分隔div？

Question

这是我一直什么远

这是我的代码：

function createWordTiles() { 
      var word = ['Example']; 
      var innerDiv; 

      var iDiv = document.createElement('div'); 
      iDiv.id = 'tileBlock'; 
      iDiv.className = "tileBlock"; 

代码的工作只有我删除循环：

  for (var l = 0; l <= word.length ; l++) { 

       innerDiv = document.createElement('div'); 
       innerDiv.id = 'Block' + l; 
       innerDiv.className = 'Block'; 
       innerDiv.innerHTML = word.charAt(l); 
      } 

      iDiv.appendChild(innerDiv); 

      document.getElementsByTagName('body')[0].appendChild(iDiv); 
     } 

这是我已取得

如何从字符串中写入每个字符以使用JavaScript分隔div？

Answer 1

移动你iDiv.appendChild(innerDiv);里面的for循环，像这样：

for (var l = 0; l <= word.length ; l++) { 

    innerDiv = document.createElement('div'); 
    innerDiv.id = 'Block' + l; 
    innerDiv.className = 'Block'; 
    innerDiv.innerHTML = word.charAt(l); 

    iDiv.appendChild(innerDiv); 
} 

Answer 2

HTML

<div class="container"> 
    <p class="source-text">Hello world</p> 
</div> 
<ul class="list"></ul> 

JS

jQuery(document).ready(function($) { 
var sourceText = $('.source-text').text(); // get the source text 
var $destinationElm = $('.list'); // get destination 

var i; 
for(i = 0; i < sourceText.length; i++) { // eterate through all characters 
    $destinationElm.append('<li>' + sourceText[i] + '</li>'); // appends html element with text 
}});