javascript - 将字符串的第一个字符复制到另一个 div jquery 或 javascript

Question

是否可以使用 jQuery 或 Javascript 将用户生成的字符串的第一个字符复制到另一个 div？

例如，iPhone 上的联系人列表。姓名旁边的圆圈中使用联系人姓名的第一个字母。

使用正确的代码段，输出将如下所示，其中“名字、姓氏”会有所不同。

<div class="initial">F</div>
<div class="name">First name, Last name</div>

<div class="initial">J</div>
<div class="name">John Smith</div>

我试图从这些其他帖子中获得一些想法:

• > How do I make the first letter of a string uppercase in JavaScript?
• > How can I get the first three letters of a string in JQuery?
• > Detect character in div and remove it Javascript or jQuery

但是，我不确定从哪里开始以及如何将结果输出到“初始”div。

Answer 1

执行此操作的简单方法是为 .initial 元素的 text() 提供一个函数，该函数从同级 .name 中读取第一个字符 并返回它，像这样:

$('.initial').text(function() {
  return $(this).next('.name').text().slice(0, 1).toUpperCase();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="initial"></div>
<div class="name">Foo Bar</div>

<div class="initial"></div>
<div class="name">John Smith</div>