max23
/
cnchar
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
cnchar/index.html

240 lines
12 KiB
JavaScript
Raw Normal View History

feat: 重建仓库
2020-04-06 01:51:13 +08:00
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<meta name="keywords" content="汉字,拼音,笔画数">
<meta name="description" content="获取汉字的拼音和笔画数的js库">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=8">
<title>cnchar.js by theajack</title>
<link rel="icon" href="assets/v1/images/i.ico" type="image/x-icon" />
<link rel="stylesheet" type="text/css" href="assets/v1/css/index.css" />
<link rel="stylesheet" type="text/css" href="assets/v1/css/use-part.css" />
</head>
<body>
<!--header-->
<div id="header">
<div id="title">cnchar.js</div>
feat: docs
2020-04-11 14:46:57 +08:00
<div id="smallTitle">功能全面、多端支持的汉字繁体字拼音笔画js库</div>
feat: 重建仓库
2020-04-06 01:51:13 +08:00
<a id='viewProjectLink' target="_blank" href="https://github.com/theajack/cnchar">
<div id="viewProject" class="border-btn">View project on github</div>
</a>
<div>
<input placeholder="请输入汉字尝试一下" id='tryInput' value='正在加载cnchar...' readonly class='unloaded' type="text">
</div>
<div id='tryResult'>
<div id='spell'></div>
<div id='stroke'></div>
<div id='trad'></div>
<div id='spark'></div>
<div id='strokeOrder'></div>
feat: 在线试用增加draw
2020-04-09 16:11:03 +08:00
<div id='draw'></div>
feat: 重建仓库
2020-04-06 01:51:13 +08:00
</div>
</div>
<!-- <div id="usePart" class="bg-gray2 text-black part clearfix">
<div class="part-title">快速使用</div>
<div id='useList'>
<span class='api-use-item'>汉字<span class="glyphicon glyphicon-arrow-right"></span>拼音</span>
<span class='api-use-item'>汉字<span class="glyphicon glyphicon-arrow-right"></span>拼音</span>
<span class='api-use-item'>汉字<span class="glyphicon glyphicon-arrow-right"></span>拼音</span>
<span class='api-use-item'>汉字<span class="glyphicon glyphicon-arrow-right"></span>拼音</span>
<span class='api-use-item'>汉字<span class="glyphicon glyphicon-arrow-right"></span>拼音</span>
<span class='api-use-item'>汉字<span class="glyphicon glyphicon-arrow-right"></span>拼音</span>
<span class='api-use-item'>汉字<span class="glyphicon glyphicon-arrow-right"></span>拼音</span>
<span class='api-use-item'>汉字<span class="glyphicon glyphicon-arrow-right"></span>拼音</span>
<span class='api-use-item'>汉字<span class="glyphicon glyphicon-arrow-right"></span>拼音</span>
<span class='api-use-item'>汉字<span class="glyphicon glyphicon-arrow-right"></span>拼音</span>
<span class='api-use-item'>汉字<span class="glyphicon glyphicon-arrow-right"></span>拼音</span>
<span class='api-use-item'>汉字<span class="glyphicon glyphicon-arrow-right"></span>拼音</span>
</div>
</div>
<div id='runAPI'>
</div> -->
<!--intro-->
<div id="introPart" class="bg-gray text-black part clearfix">
<div class="part-title">功能</div>
<div class="func-item">
<img class="func-img" src="assets/v1/images/pin.png" />
<div class="func-text">拼音|音调</div>
</div>
<div class="func-item">
<img class="func-img" src="assets/v1/images/duo.png" />
<div class="func-text">多音字|词</div>
</div>
<div class="func-item">
<img class="func-img" src="assets/v1/images/bi.png" />
<div class="func-text">笔画数|笔序</div>
</div>
<div class="func-item">
<img class="func-img" src="assets/v1/images/fan.png" />
<div class="func-text">繁体字|火星文</div>
</div>
</div>
<!--download-->
<div id="downloadPart" class="bg-dark text-white part">
<div class="part-title">安装使用</div>
<pre class='demo-code'>import cnchar from 'cnchar';
'汉字'.spell();
'汉字'.stroke();</pre>
<pre class='demo-code'>&lt;script src="https://cdn.jsdelivr.net/gh/theajack/cnchar/dist/cnchar.latest.min.js">&lt;/script>
&lt;script>
'汉字'.spell();
'汉字'.stroke();
&lt;/script></pre>
<!-- <div class="part-title small font-size-bigger">1.script 标签方式引入</div>
<div class="part-title small">引用： &lt;script src="https://www.theajack.com/cnchar/cnchar.min.js"&gt;&lt;/script&gt;</div>
<div class="part-title small font-size-bigger">2.npm 方式安装</div>
<div class="part-title small">安装: npm install cnchar</div>
<div class="part-title small">使用: import CnChar from 'cnchar' 或 const CnChar = require('cnchar')</div> -->
<!-- <div id="copyBtn" class="border-btn mb-install" onclick="J.open('cnchar.2.0.4.min.js')">复制源码</div> -->
<div id="copyBtn" class="border-btn mb-install"
onclick="J.open('https://github.com/theajack/cnchar#user-content-cnchar')">点我查看详细</div>
</div>
</div>
<!--api-->
<div id="apiPart" class="bg-gray part clearfix">
<div class="part-title text-black relative">简单使用</div>
<div class="api-item">
<div class="api-item-title">.spell()</div>
<div class="api-item-text">获取汉字完整拼音</div>
<div class="api-content-wrapper">
<div class="api-content clearfix">
"测试".spell()
<span class="api-content-result" onclick="this.txt('测试'.spell())">查看</span>
</div>
<div class="api-content clearfix">
"测试".spell("up")
<span class="api-content-result" onclick="this.txt('测试'.spell('up'))">查看</span>
</div>
<div class="api-content clearfix">
"测试".spell("low")
<span class="api-content-result" onclick="this.txt('测试'.spell('low'))">查看</span>
</div>
<div class="api-content clearfix">
"测试".spell("array")
<span class="api-content-result" onclick="this.txt('测试'.spell('array'))">查看</span>
</div>
<div class="api-content clearfix">
"测试".spell("array","up")
<span class="api-content-result" onclick="this.txt('测试'.spell('array','up'))">查看</span>
</div>
<div class="api-item-text">非汉字会返回原字符串</div>
</div>
<div class="api-test-wrapper">
<div class="api-item-ltitle">尝试一下</div>
<input type="text" class="api-test-input" placeholder="请输入汉字" />
<span class="api-test-btn" onclick="this.prev().val(this.prev().val().spell())">获取</span>
</div>
</div>
<div class="api-item">
<div class="api-item-title">.spell('first')</div>
<div class="api-item-text">获取汉字拼音首字母</div>
<div class="api-content-wrapper">
<div class="api-content clearfix">
"测试".spell('first')
<span class="api-content-result" onclick="this.txt('测试'.spell('first'))">查看</span>
</div>
<div class="api-content clearfix">
"测试".spell('first','low')
<span class="api-content-result" onclick="this.txt('测试'.spell('first','low'))">查看</span>
</div>
<div class="api-content clearfix">
"测试".spell("array",'first',"up")
<span class="api-content-result" onclick="this.txt('测试'.spell('array','first','up'))">查看</span>
</div>
<div style="height:1px"></div>
<div class="api-item-text">非汉字会返回原字符串</div>
</div>
<div class="api-test-wrapper">
<div class="api-item-ltitle">尝试一下</div>
<input type="text" class="api-test-input" placeholder="请输入汉字" />
<span class="api-test-btn" onclick="this.prev().val(this.prev().val().spell('first'))">获取</span>
</div>
</div>
<div class="api-item">
<div class="api-item-title">.stroke()</div>
<div class="api-item-text">获取汉字笔画数</div>
<div class="api-content-wrapper">
<!-- <div class="api-item-ltitle">如何使用</div> -->
<div class="api-content clearfix">
"测试".stroke()
<span class="api-content-result" onclick="this.txt('测试'.stroke())">查看</span>
</div>
<div class="api-item-text">非汉字会返回原字符串长度</div>
</div>
<div class="api-test-wrapper">
<div class="api-item-ltitle">尝试一下</div>
<input type="text" class="api-test-input" placeholder="请输入汉字" />
<span class="api-test-btn" onclick="this.prev().val(this.prev().val().stroke())">获取</span>
</div>
</div>
</div>
<!--relate-->
<div id="relatePart" class="bg-dark text-white part ">
<div class="part-title hassmall">友情链接</div>
<div class="part-title small">(欢迎访问)</div>
<div id="tjLinks">
</div>
</div>
<!--footer-->
<div id="footer" class="bg-black text-white part">
<div id="footerLink">
<span class="link" onclick="J.open('https://github.com/theajack')">GitHub</span>
<span class="split-icon">|</span>
<span class="link"
onclick="J.open('http://weibo.com/p/1005055304330572/home?from=page_100505&mod=TAB&is_all=1')">Sina
Micro-blog</span>
<span class="split-icon">|</span>
<span class="wechat-public d-hide" onclick="this.child(0).fadeToggle()">
WeChat Official Accounts
<img class="wechat-img" src="assets/v1/images/wechat_qrcode.jpg" />
</span>
<span class="split-icon d-hide">|</span>
Email:theajack@qq.com
<span class="split-icon d-hide">|</span>
<span class="link d-hide" onclick="J.open('https://www.theajack.com')">theajack.com</span>
<div class=" d-show">
<span class="wechat-public" onclick="this.child(0).fadeToggle()">
WeChat Official Accounts
<img class="wechat-img" src="assets/v1/images/wechat_qrcode.jpg" />
</span>
<span class="split-icon">|</span>
<span class="link" onclick="J.open('https://www.theajack.com')">theajack.com</span>
</div>
</div>
<div id="copyright">
<span class="glyphicon glyphicon-copyright-mark"></span> <span id='_year'>20xx</span> TheaJack All rights reserved
</div>
</div>
<script src="https://cdn.jsdelivr.net/gh/theajack/theajack.github.com/assets/js/jetter.min.js"></script>
<script src="assets/v1/js/index.js"></script>
feat: 在线试用增加draw
2020-04-09 16:11:03 +08:00
<script src="https://cdn.jsdelivr.net/npm/cnchar-all/cnchar.all.min.js" onload='loaded()'></script>
feat: 重建仓库
2020-04-06 01:51:13 +08:00
<!-- <script src="https://www.theajack.com/cnchar/dist/cnchar.latest.min.js"></script>
<script src="https://www.theajack.com/cnchar/dist/cnchar.order.latest.min.js"></script>
<script src="https://www.theajack.com/cnchar/dist/cnchar.poly.latest.min.js"></script>
<script src="https://www.theajack.com/cnchar/dist/cnchar.trad.latest.min.js" onload='loaded()'></script> -->
<script src="assets/v1/js/run.js"></script>
<script src="https://cdn.jsdelivr.net/gh/theajack/theajack.github.com/assets/js/link.js"></script>
<script src="https://cdn.jsdelivr.net/gh/theajack/theajack.github.com/assets/js/logo.js"></script>
<script src="https://cdn.jsdelivr.net/gh/theajack/theajack.github.com/assets/js/log.js"></script>
<!--<script type="text/javascript" name="cnchar.js" src="https://www.theajack.com/assets/js/stat.js"></script>-->
<script>
var _mtac = {};
(function () {
var mta = document.createElement("script");
mta.src = "//pingjs.qq.com/h5/stats.js?v2.0.4";
mta.setAttribute("name", "MTAH5");
mta.setAttribute("sid", "500700068");
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(mta, s);
})();
</script>
</body>
</html>