如何用原生js写一个获取汉字的首字母拼音

我们可以使用 pinyin.js 库来实现获取汉字的首字母拼音。

1. 首先，我们需要在 HTML 文档中引入 pinyin.js 库：

<script src="https://cdn.bootcss.com/pinyinjs/0.4.0/pinyin.min.js"></script>

2. 然后，我们可以使用以下代码来获取汉字的首字母拼音：

// 获取汉字的首字母拼音
function getPinyin(str) {
  let pinyin = '';
  if (str.length > 0) {
    // 转换为拼音数组，取第一个字母
    const arr = PinyinHelper.convertToPinyinArray(str.charAt(0));
    if (arr.length > 0) {
      pinyin = arr[0].charAt(0);
    }
  }
  return pinyin;
}

3. 最后，我们可以在页面中调用 getPinyin 函数并传入汉字参数来获取其首字母拼音：

<input type="text" id="input" onchange="getFirstPinyin()">
<p id="output"></p>

<script>
function getFirstPinyin() {
  const input = document.getElementById('input').value;
  const output = document.getElementById('output');
  output.innerText = getPinyin(input);
}
</script>

以上代码可以在输入框中输入汉字，然后点击输入框外的空白处或按下 Enter 键来触发 getFirstPinyin 函数，从而获取汉字的首字母拼音并显示在页面上。