<style> ul { text-align: justify; background: #eee;} ul li { width: 350px; height: 350px; border: 1px solid red; list-style: none; display: inline-block; margin-top: 20px;}</style><body> <button>add</button> <ul> <li>li</li> <li>li</li> <li>li</li> </ul></body><script>$("button").click(function() { $("ul").append("<li>li</li>");})</script>本来以为动态数据不会对css样式造成影响，但是却发现了一个问题。
当text-align值是center的时候，元素居中，无论后来追加多少个，每次追加都会重新计算，元素都是居中显示。
但是当text-align值是justify的时候，当超过一行的时候，第一行最后几个（数量不定，好像是和元素的宽度有关）会紧挨着，之后再追加，下面的行里都不会按照text-algin:justify方式显示，会紧挨着。只有在页面加载的时候渲染出来的才会正常显示。。
问下各位，这个有没有解决办法。
解决方案
因为用append方法添加的元素中间是没有空格的
所以$("ul").append(" <li>li</li> ");就可以了。
不过还有一点奇怪的是5个刚好一行的时候的样式不正常，一定要多出一个时候才能够算是撑满？