使用jQuery操作后维护对齐的内联块元素的对齐

Question

我正在使用text-align：justify来均匀地分隔内联块元素。我使用jQuery交换某些元素，以便更好地适应（例如，更有效地填充行）。但是，浏览器不再正确地证明交换的元素。有没有办法让浏览器重新证明元素能够克服这个问题？

修改 这是一个显示问题的jsfiddle：http://jsfiddle.net/sprintstar/HKDd9/3/

Answer 1

问题在于内联块元素之间缺少空间。您错过的是文本节点：

$(function() {
    var eq3 = $('.container a:eq(3)');
    var eq4 = $('.container a:eq(4)');
    eq4.before(eq3).before(" ");
});​

http://jsfiddle.net/archatas/HKDd9/4/

Answer 2

我有一个可能的解决方案，但我不确定您的代码无法正常工作的原因。也许有人可以对这个问题有所了解。

首先eq4.before(eq3);表示您将它放回到您选择它的位置。我相信你的意思是eq4.insertBefore(eq3);

我尝试添加新元素，但效果很好

 $('<a href="#" class="sq-1"><img src="http://placehold.it/64x32" /></a>').insertBefore(eq3);

编辑：  但克隆相同的元素并不会产生相同的结果。

eq4.clone().insertBefore(eq3);
eq4.remove();