成语接龙、歇后语 js JavaScript html web nodejs成语接龙离线js库

介绍一款可以玩成语接龙的js库

1. 介绍

cnchar是一款功能全面、多端支持的汉字拼音笔画 js 库

官方文档

在版本2.2.0，cnchar引入了成语功能，cnchar几乎涵盖了与汉字有关的方方面面，拼音、笔画、笔顺、多音字词…

以下是详细功能描述

获取 汉字拼音 ，支持首字母、大小写、数组分割、备选 多音字 等功能
支持 多音词
支持 拼音音调
获取汉字 笔画数 、支持数组分割
获取汉字 笔画顺序 、笔画详细名称
支持可视化 绘制汉字笔画 、多种绘制模式可选
支持 简体字 、 繁体字 、 火星文 互转
支持查找某拼音的所有汉字，繁体字，多音字
支持查找指定笔画数的所有汉字，繁体字
支持 根据笔画顺序查询 汉字
支持 查询拼音的信息，包含声母、韵母、音调、音调位置的等
支持 繁体字 拼音、笔画数及以上所有功能，实现和简体字一样的功能
支持成语查询功能，可以按照汉字、拼音（声调）、笔画数查询成语
支持 歇后语 查询功能，支持模糊查询
提供汉字工具方法，方便开发者更便捷高效地 操作拼音和汉字
体积小，min 版本仅 46 kb，zip 版本 34 kb (含有大量汉字拼音字典)
多端可用，可用于 浏览器、nodejs、小程序/小游戏、ReactNative/Weex/Uniapp/Electron、webpack…，支持所有 js 能运行的环境
typescript支持，支持在typescript中调用
丰富的配置，按功能拆分成7个库按需取用

2. 进入正题：成语接龙

cnchar可以按照 特定汉字、拼音、带音调拼音、笔画数 进行成语查询，

2.1. 汉字查询成语

如果只是按照特定汉字查询，则只需要引入 cnchar-idiom 库即可(官方文档)，如下：

2.1.1. cdn引入及使用

<script src="https://cdn.jsdelivr.net/npm/cnchar-idiom/cnchar.idiom.min.js"></script>
<script>CncharIdiom(['五']); // 查询以'五'字开头的成语CncharIdiom(['五', '', '十', '']); // 查询符合 '五x十x' 的成语，其他模板也可以类推，比如 ['一', '年', '', '']// 数组末尾的空字符串可以省略 ['一', '年', '', ''] 等价于 ['一', '年']
</script>

2.1.2. npm 方式引入

支持nodejs和其他各种js运行环境

先安装

npm i cnchar-idiom

import CncharIdiom from 'cnchar-idiom';
// 调用与cdn方式一致
CncharIdiom(['五']);
CncharIdiom(['五', '', '十', '']);

2.2. 汉字查询成语

如果只是需要按照拼音或者笔画数查询成语，则需要依赖cnchar主库的拼音和笔画数能力

2.2.1. cdn引入及使用

<script src="https://cdn.jsdelivr.net/npm/cnchar/cnchar.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/cnchar-idiom/cnchar.idiom.min.js"></script>
<script>cnchar.idiom('wu', 'spell');// 查询以拼音wu开头的成语，需要带上‘spell’参数// 另外由于对字典进行获取拼音耗时很长，所以cnchar仅提供成语首个汉字的拼音查询，并优化的了算法，使可以在毫秒级获取运算结果cnchar.idiom('wu3', 'spell', 'tone');// 支持音调, 同时支持 wu3 和 wǔ 两种写法cnchar.idiom([4, 6, 2, 0], 'stroke'); // 笔画数查询， 0 表示匹配任意汉字
</script>

2.2.1. npm引入及使用

安装：

npm i cnchar cnchar-idiom

import cnchar from 'cnchar';
import idiom from 'cnchar-idiom';
cnchar.use(idiom); // 浏览器环境下 use 并不是必须的//使用于cdn模式一致
cnchar.idiom('wu', 'spell');
cnchar.idiom('wu3', 'spell', 'tone');
cnchar.idiom([4, 6, 2, 0], 'stroke');

3. 歇后语查询

歇后语不是本文重点，请参考官方文档

成语接龙、歇后语 js JavaScript html web nodejs成语接龙离线js库相关推荐

js - JavaScript
文章目录前言第一章 JavaScript简介 JavaScript的起源静态网页和动态网页动态网页网页是如何和后端交互的呢? JS概述什么是JS 名词解释特点和优势入门案例 HTML中 ...
16个Javascript的Web UI库、框架及工具包
目前,几乎所有的富Web应用程序都依赖一套UI管理,程序库或框架(或工具包),他们不仅简化了应用程序开发,他们还提供兼容的.可靠的及很强交互性的用户界面.除此之外您会请求哪些呢? 当前,广泛应用的We ...
atitit.js javascript 调用c# java php后台语言api html5交互的原理与总结p97
atitit.js javascript 调用c# java php后台语言api html5交互的原理与总结p97 1. 实现html5化界面的要解决的策略1 1.1. Js交互1 1.2. 动态参 ...
java swing调用H5_atitit.js javascript 调用c# java php后台语言api html5交互的原理与总结p97...
atitit.js javascript 调用c# java php后台语言api html5交互的原理与总结p97 1.实现html5化界面的要解决的策略 1.1.Js交互 Firefox与Chro ...
从前慢-JavaScript之Web API-篇章4
JavaScript之Web API-篇章4 1 PC端网页特效 1.1 元素偏移量 offset 系列 offset 翻译过来就是偏移量, 我们使用 offset 系列相关属性可以动态的得到该元素 ...
Atitit.js javascript异常处理机制与java异常的转换多重catc hDWR 环境 .js exception process Vob7...
Atitit.js javascript异常处理机制与java异常的转换多重catc hDWR 环境 .js exception process Vob7 1. 1. javascript异常处理机 ...
阿提拉公司 java_Atitit 文件上传架构设计实现机制解决方案实践java php c#.net js javascript c++ python...
Atitit 文件上传架构设计实现机制解决方案实践 java php c#.net js javascript c++ python 1 . 上传的几点要求 2 1 .1. 本地预览 2 1 ...
Atitit. 数据约束校验原理理论与架构设计理念模式java php c#.net js javascript mysql oracle...
Atitit. 数据约束校验原理理论与架构设计理念模式java php c#.net js javascript mysql oracle 1. 主键1 2. uniq index2 3. ...
JavaScript 学到什么程度可以学 Node.js？
学习nodeJS, 理论上其实并不需要JS基础只不过你熟悉Js的话, 有相当多的语法是一致的(因为源自同一个引擎) 会很大程度降低学习成本但是, nodeJS比传统的浏览器端的Javascript ...
Heroku + node.js错误（Web进程在启动后60秒内未能绑定到$ PORT）
本文翻译自:Heroku + node.js error (Web process failed to bind to $PORT within 60 seconds of launch) I hav ...