我希望通过<br />
使用 jQuery 在字符之间添加标签来垂直对齐文本。
<div id="foo"><label>Vertical Text</label></div>
看起来像这样:
V
e
r
t
i
c
a
l
T
e
x
t
我希望通过<br />
使用 jQuery 在字符之间添加标签来垂直对齐文本。
<div id="foo"><label>Vertical Text</label></div>
看起来像这样:
V
e
r
t
i
c
a
l
T
e
x
t
我们去打高尔夫球吧!
$('#foo label').html($('#foo label').text().replace(/(.)/g,"$1<br />"));
完全未经测试,但正则表达式中的模式看起来像一个胸部。
Kurt 先生的答案适用于单个 id,但如果您想要更有用的东西可以应用于多个元素,请尝试以下操作:
$.each( $(".verticalText"), function () { $(this).html($(this).text().replace(/(.)/g, "$1<br />")) } );
然后只需设置class="verticalText"
要像这样格式化的元素。
作为奖励,它保留了 boob 正则表达式。
未经测试,但它应该可以工作。
var element = $( '#foo label' );
var newData = '';
var data = element.text();
var length = data.length;
var i = 0;
while( i < length )
{
newData += data.charAt( i ) + '<br />';
i++;
}
element.html( newData );
document.write("vertical text".split("").join("<br/>"));
编辑:一杆进洞!
这建立在塞巴斯蒂安 H 的回答之上,但我对其进行了测试,这很有效
var element = $( '#foo label' );
var newData = '';
var data = element.text();
var length = data.length;
var i = 0;
$( '#foo label' ).html("");
while( i < length )
{
$( '#foo label' ).append(data.charAt( i ) + "<br />")
i++;
}
既然可以使用 jQuery 的内置 each 方法,为什么还要使用 while 循环?
$.each(
$('#foo').text(), function(){
$('#foo').append(this + '
');
}
);
那里。有用。你可以测试一下。