jQuery将div的文本转换为垂直文本

Question

让我说我得到了这个div

<div>
    Convert This into a vertical Text
</div>

在搜索我可以将此文本转换为垂直文本的方式时。

我发现了这样的事情：

$('div').html($('div').text().replace(/(.)/g,"$1<br />"));

这很有用。
但是有更好的方法吗？

Answer 1

$('div').text(function(i, text) {
    return $.trim(text).split('').join('\n');
}).css('white-space', 'pre');

jsFiddle

用您需要的任何内容替换div选择器。

Answer 2

$('div').html( $('div').text().split('').join('<br />') );

Answer 3

在每个字符之间放一个空格，然后给div一个非常窄的宽度看这个小提琴

http://jsfiddle.net/3dFgg/1/

Answer 4

像这样

$('div').css('-moz-transform','rotate(90deg)');
$('div').css('-webkit-transform','rotate(90deg)');
$('div').css('-o-transform','rotate(90deg)');
$('div').css('writing-mode','tb-rl');

或

<style>
.vert_text{
 -moz-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
-o-transform: rotate(90deg);
 writing-mode: tb-rl;
}
</style>

$('div').toggleClass('vert_text');