文本对齐：证明不处理动态创建的内容答案

【问题标题】：Text-align: justify not working on dynamically created content文本对齐：证明不处理动态创建的内容
【发布时间】：2014-01-28 17:32:16
【问题描述】：

我正在尝试使用 this post 中描述的 text-align:justify 和 display:inline-block 来设置一些动态创建的元素的样式。在将我的头撞到墙上检查 CSS 冲突之后，我终于意识到这是在创建内容后没有重新评估对齐方式。我想知道是否有人知道解决此问题的方法。有没有办法强制对动态创建的元素重新评估样式？

编辑 - HTML：

<div id="container" class="flush">

</div>

<div class="flush">
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
</div>

CSS：

.flush{
text-align: justify;
width: 500px;
height: 250px;
background: #00f;
}

.flush div{
display: inline-block;
width: 101px;
height: 100px;
background: #f00;
}

JS：

for(var i = 0; i<5; i++){  
  $('#container').append("<div></div>");
}

这里有一个jsfiddle example 来说明。注意硬编码的元素是如何对齐的，而动态创建的元素却不是。

【问题讨论】：

如何将内容放入div中？因为在 css 中不需要这样做，但在某些情况下 $(".some").css('width', 300); 会这样做 api.jquery.com/css
内容正在由 javascript 创建。样式表中声明的大多数 CSS 属性（高度、宽度）都被应用了。我认为问题在于创建子元素时需要重新评估父容器上的样式。
您可以发布一些代码和 jsfiddle.net 示例来重新创建问题吗？
好建议！以上编辑。
编辑了我的答案第二个解决方案更好

标签： javascript jquery html css

【解决方案1】：

只需在动态创建div 后添加space ;)

$('#container').append("<div></div> ");

吃饱了！

编辑

这样更好

$('#container').append("<div></div>\n\r");

http://jsfiddle.net/ergec/4pswV/

【讨论】：

啊，完全有道理。谢谢！