autoComplete.js is a simple, pure vanilla Javascript library progressively designed for speed, high versatility, and seamless integration with a wide range of projects & systems. _{^{(Made for a better developer experience)}}- Works on anything (``, `` and `contentEditable` elements)</small><div class="base">-  Well Documented</div><div class="base"> <a href="https://codepen.io/tarekraafat/pen/rQopdW?editors=0010" title="autoComplete.js Code Example" target="_blank" rel="nofollow noopener noreferrer"><img src="https://raw.githubusercontent.com/TarekRaafat/autoComplete.js/master/docs/img/autoComplete.init.png "autoComplete.js Code Example"" alt="autoComplete.js Code Example"/></a></div><div class="base"><br></div><div class="base"><h2>Getting Started</h2></div><div class="base"><br></div><div class="base"><h3>Installation:</h3></div><div class="base"><br></div><div class="base"><h4>CDN</h4></div><div class="base"><br></div><div class="base"><span class="edit-backquote">JS</span></div><div class="base"><br></div><div class="code"><ol start="0"><li><span>``` html</span></li><li><span class="html-label"><script</span><span class="html-type"> src</span><span>=</span><span class="html-value">"https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@10.2.7/dist/autoComplete.min.js"</span><span class="html-label">></span><span class="html-label"></script</span><span class="html-label">></span></li><li><span>```</span></li></ol></div><div class="base"><br></div><div class="base"><span class="edit-backquote">CSS</span></div><div class="base"><br></div><div class="code"><ol start="0"><li><span>``` html</span></li><li><span class="html-label"><link</span><span class="html-type"> rel</span><span>=</span><span class="html-value">"stylesheet"</span><span class="html-type"> href</span><span>=</span><span class="html-value">"https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@10.2.7/dist/css/autoComplete.min.css"</span><span class="html-label">></span></li><li><span>```</span></li></ol></div><div class="base"><h4>Package Manager</h4></div><div class="base"><br></div>- <a href="https://www.npmjs.com/package/@tarekraafat/autocomplete.js" target="_blank" rel="nofollow noopener noreferrer">npm</a> install `(Node Package Manager)`<div class="base"><br></div><div class="code"><ol start="0"><li><span>`</span><span>`</span><span>`</span><span> </span><span class="js-variable">sh</span></li><li><span class="js-variable">npm</span><span> </span><span class="js-variable">i</span><span> </span><span>@</span><span class="js-variable">tarekraafat</span><span>/</span><span class="js-variable">autocomplete</span><span class="js-variable">.js</span></li><li><span>`</span><span>`</span><span>`</span></li></ol></div><div class="base"><br></div>- <a href="https://yarn.pm/@tarekraafat/autocomplete.js" target="_blank" rel="nofollow noopener noreferrer">Yarn</a> install `(Javascript Package Manager)`<div class="base"><br></div><div class="code"><ol start="0"><li><span>`</span><span>`</span><span>`</span><span> </span><span class="js-variable">sh</span></li><li><span class="js-variable">yarn</span><span> </span><span class="js-variable">add</span><span> </span><span>@</span><span class="js-variable">tarekraafat</span><span>/</span><span class="js-variable">autocomplete</span><span class="js-variable">.js</span></li><li><span>`</span><span>`</span><span>`</span></li></ol></div><div class="base"><br></div><div class="base"><br></div><div class="base"><br></div><div class="base"><h2>Documentation:</h2></div><div class="base"><br></div>- For usage & configuration details check out **autoComplete.js** <a href="https://tarekraafat.github.io/autoComplete.js/" target="_blank" rel="nofollow noopener noreferrer">**docs** :notebook_with_decorative_cover:</a><div class="base"><br></div><div class="base"><br></div><div class="base"><br></div><div class="base"><h2>Community Plugins:</h2></div><div class="base"><br></div><div class="base">-   <a href="https://github.com/heimrichhannot/contao-autocompletejs-bundle" title="Contao autoComplete.js Bundle" target="_blank" rel="nofollow noopener noreferrer">Contao autoComplete.js Bundle</a> by <a href="https://github.com/heimrichhannot" title="@heimrichhannot" target="_blank" rel="nofollow noopener noreferrer">@heimrichhannot</a></div><div class="base"><br></div><div class="base"><span class="pre-spot"></span><span class="edit-star-italic"> </span></div><div class="base"><br></div><div class="base"><h2>Support</h2></div><div class="base"><br></div><div class="base">Technical questions and support, please post your question on Stack Overflow using the below tag</div><div class="base"><br></div><div class="base">- Stack Overflow [autoCompletejs][stackOverflow]</div><div class="base"><br></div><div class="base"><br></div><div class="base">General questions or new ideas for <span class="edit-backquote">autoComplete.js</span> please start a discussion on Github using the below link</div><div class="base"><br></div><div class="base">- Github [Discussions]</div><div class="base"><br></div><div class="base"><br></div><div class="base">[Discussions]: https://github.com/TarekRaafat/autoComplete.js/discussions</div><div class="base">[stackoverflow]: https://stackoverflow.com/questions/tagged/autoCompletejs</div><div class="base"><br></div><div class="base"><span class="pre-spot"></span><span class="edit-star-italic"> </span></div><div class="base"><br></div><div class="base"><h2>Author</h2></div><div class="base"><br></div><div class="base"><span class="edit-star-bold">Tarek Raafat</span></div><div class="base"><br></div><div class="base">-   Email: tarek.m.raafat@gmail.com</div><div class="base">-   Website: <a href="http://www.tarekraafat.com/" title="tarekraafat.com" target="_blank" rel="nofollow noopener noreferrer">tarekraafat.com</a></div><div class="base">-   Github: <a href="https://github.com/TarekRaafat/" title="github.com/TarekRaafat" target="_blank" rel="nofollow noopener noreferrer">github.com/TarekRaafat</a></div><div class="base"><br></div><div class="base"><span class="pre-spot"></span><span class="edit-star-italic"> </span></div><div class="base"><br></div><div class="base"><h2>License</h2></div><div class="base"><br></div><div class="base">Released under the <a href="https://www.apache.org/licenses/LICENSE-2.0" title="Apache 2.0 license" target="_blank" rel="nofollow noopener noreferrer">Apache 2.0 license</a>.</div><div class="base"><br></div><div class="base">© 2022 <a href="http://www.tarekraafat.com" title="Tarek Raafat" target="_blank" rel="nofollow noopener noreferrer">Tarek Raafat</a></div><div class="base"><br></div></div></div></div><div id="footer"><div class="footer-box"><div class="footer-info"><div class="fi-logo"><img src="/img/footer-logo.png" width="65"/></div><div class="fi-intro"><strong>为什么是最好的 GitHub 项目？</strong><p>技术的发展速度比以往任何时候都快，技术正在全速创新。几乎每天都会发布惊人的开源项目。</p><p><br/></p><strong>如何了解最新趋势？</strong><p>如何快速检查真正重要的项目，现在而不是 6 个月前？</p><p>探客时代每天拍摄 GitHub stars 的 “快照”，以获得 2000 多个项目的精选列表，以检测过去几个月的趋势。</p><p><br/></p><strong>你想要更多的项目吗？</strong><p>我们不会扫描 GitHub 上的所有现有项目，而是根据我们的经验和我们在 Internet 上阅读的内容，专注于我们发现 “有趣” 的精选项目列表。想要了解的项目可以提交给我们。</p></div><div class="fi-qrcode"><h3>关注公众号</h3><img src="/img/qrcode.jpg" width="272" height="272"/></div></div><div class="footer-copyright">© 2022, 北京探客时代网络科技有限公司　<br/><a href="http://beian.miit.gov.cn" target="_blank" rel="nofollow noopener noreferrer">京 ICP 备 2022008592 号</a>　<a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11011402012574" target="_blank" rel="nofollow noopener noreferrer">京公网安备 11011402012574 号</a>　<a href="contact.html" target="_blank" rel="nofollow noopener noreferrer">信息举报</a></div></div></div><script>function request(t,e,n){$.ajax({url:t,type:"get",data:e,dataType:"json",success:function(t){n(t.data)}})}function levenshtein(t,e){t=t.toLowerCase(),e=e.toLowerCase();for(var n=t.length,o=e.length,i=[],a=0;a<n+1;a++)i.push(new Array(o+1));for(a=0;a<=n;a++)i[a][0]=a;for(a=0;a<=o;a++)i[0][a]=a;var l,s=t.split(""),r=e.split("");for(a=1;a<=n;a++)for(var c=1;c<=o;c++){l=s[a-1]==r[c-1]?0:1;var u=i[a-1][c-1]+l,h=i[a][c-1]+1,f=i[a-1][c]+1;i[a][c]=Math.min(u,h,f)}return 1-i[n][o]/Math.max(t.length,e.length)}$(function(){var t=[],e=[];request("https://api.tkcnn.com/gh/tag/all",null,function(e){t=e;var n=window.location.href.match(/([\w-]+)\.html/);if(n){var o=t.find(t=>t.code===n[1]);o&&$(".select-set").val(o.name)}}),$(".select-set").on("click input",function(){var n=$(this).val();if(n=n.replace(/(^\s+|\s+$)/g,""),e=[],""===n.replace(/s/g,""))e=t;else{for(var o,i=0;i<t.length;i++)(o=levenshtein(n,t[i].name))>=.1&&e.push({name:t[i].name,code:t[i].code,count:t[i].count,similar:o});e.sort(function(t,e){return e.similar-t.similar})}var a="";for(i=0;i<e.length;i++)a+=`<button>${e[i].name} (${e[i].count})</button>`;$(".select-list").html(a)}),$(".select-list").on("click","button",function(t){$(".select-list").hide(),setTimeout(function(){$(".select-list").css("display","")},200),window.location.href=window.location.origin+`/repo/${e[$(this).index()].code}.html`})});</script></body></html>