javascript – 将html标签添加到字符串中的每个字母

前端之家收集整理的这篇文章主要介绍了javascript – 将html标签添加到字符串中的每个字母前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我在div中有一串字母 – 比如这……
<div>hello</div>

我想为字符串中的每个字母添加一个html标记,这样就可以了 – 就像这样

<div>
    <span>h</span>
    <span>e</span>
    <span>l</span>
    <span>l</span>
    <span>o</span>
</div>

由于此div中的字母将动态更改,因此它不能是静态的,因此我想使用jquery将spans应用于字符串的每个字母.

任何帮助将不胜感激 – 谢谢!

解决方法

几个步骤:

>抓取文本内容并创建一个单独的字符数组,
>清空原始容器,
>将每个字母添加为span元素.

代码

$('div').each(function() {
    var letters = $(this).text().split(''),$container = $(this).empty();

    $.each(letters,function(_,letter) {
       $('<span>',{text: letter}).appendTo($container);
    });
});

Demo

猜你在找的JavaScript相关文章