Rob*_*nik 23 css jquery append line-breaks dom-manipulation
我有一个jQuery元素集,我通过调用从DOM获得:
$(".some-selector");
Run Code Online (Sandbox Code Playgroud)
我的所有元素都是各自的DIV.我的DIV设置CSS(除其他外)
display: inline-block;
Run Code Online (Sandbox Code Playgroud)
这会阻止它们作为块元素呈现(每个元素都在它自己的行中).
问题是,当渲染这些DIV时,它们之间会有空格,因为每个元素之间的文档中都有换行符.我很满意.我当然可以使用float:left它来摆脱这些空间,但这不是我想要的,因为我会有容器大小等其他问题.
所以.问题是我在jQuery set中操纵这些元素的顺序然后重新渲染它们.我基本上做的是:
$(".some-selector").detach().manipulate().appendTo(".container");
// or equivalent
$(".container").append($(".some-selector").detach().manipulate());
Run Code Online (Sandbox Code Playgroud)
问题是它们被重新插入DOM,但没有换行符或空格......
在将元素追加到DOM中时,如何获得这些换行符?
gil*_*ly3 41
重新插入元素后,使用.after()以下内容为每个元素添加一些空格:
$(".some-selector").after(" ");
Run Code Online (Sandbox Code Playgroud)
您可以使用map在每个DIV之后放置单空间TextNode:
$('.some-selector').detach().manipulate().map(function() {
return [this, document.createTextNode(' ')];
}).appendTo('.container');
Run Code Online (Sandbox Code Playgroud)
现场演示: http ://jsfiddle.net/Hnv2T/