java API 文档添加类名搜索功能

可能会有同学像我一样把某些类库的API doc(一些java doc产生的HTML 文件,如jdk 文档,lucene 文档)下载后放到本地的tomcat 或IIS 服务器中来查看,免受网络影响。但是 java doc 产生时未带类名搜索功能。如果不想自己搞的话,可以按以下步骤快速给文档添加搜索功能。

操作步骤

  1. 找到库的allclasses-frame.html 文件, 如jdk 文档的话是在 api/allclasses-frame.html
  2. 添加搜索框
    找到indexContainer 的div, 在该div 下添加个搜索框。
    <input type="search" placeholder = "输入类名搜索" id="id_search_class" />
  3. 添加搜索逻辑
    在结尾的body 和 html 标签中添加个script 标签,为以下内容。
<script  type="text/javascript">
     var classes = [];
    let eles = document.querySelectorAll("ul  > li");
    eles.forEach( x =>  classes.push(x)) 
  
    var input_search_class = document.querySelector("#id_search_class");
    input_search_class.addEventListener('keydown', (event) => {
        if (event.keyCode == 13) {
            let ul = document.querySelector("ul");
            let val = event.srcElement.value;
          
            // 搜索词为空
            if (!val) {
              if (ul.childNodes.length == packages.length ) return;
              ul.innerHTML = "";
              classes.forEach( x => ul.appendChild(x) );
              return; 
            } 
          
          // 搜索
          ul.innerHTML = "";
          classes.forEach( x => {
              if ( x.childNodes[0].getAttribute("href").toLowerCase().indexOf(val.toLowerCase()) != -1 ) {
                  ul.appendChild(x);
              }
          })
        }
    })
  </script>
注意第一步的id 不要修改,修改的话要相应修改 script 中的代码。
  1. 清理浏览器缓存,再次刷新时可看到搜索框可使用。类似也可以给包 添加搜索功能。
posted @ 2020-04-20 00:39  宇德高辉  阅读(411)  评论(0编辑  收藏  举报