利用JavaScript编写Python内置函数查询工具

最近我开始学习Python编程语言,我发现Python拥有非常丰富的内置函数,可以用来实现各种不同的功能。但是每当我需要查找一个内置函数时,我总是需要联网使用搜索引擎进行查询。这种方式不仅费时费力,而且需要联网,很不方便。我曾在网上搜索过一个能够离线查询Python内置函数的小工具,但却没有找到合适的工具。

因此,我决定自己开发一个这样的小工具,以方便自己的Python学习和开发。我之前写过一个可以查询8086汇编指令的小工具,我决定在这个基础上进行改进。

我将使用Python语言来编写这个小工具,这样我就可以在不用离开编辑器的情况下快速查找所需的内置函数。我的计划是将所有的Python内置函数收录在这个小工具中,并提供简要的文档说明和示例代码,以帮助我更好地理解和使用这些函数。

在我完成这个小工具后,我将分享给其他人,希望可以帮助他们更轻松地学习Python编程。我相信这个小工具会对所有的Python初学者非常有用,也会对一些有经验的Python开发者提供帮助。

一、程序效果展示

输入字母会自动出现匹配的下拉列表,控制键盘↑和↓键就可以上下移动选择想查看的Python内置函数,如下图。

二、程序编写过程

(一)为方便使用,实现只用一个HTML文件运行,小工具中所有的数据都使用<div></div>标签进行存放,并直接利用Python内置函数名作为div的id,例如:<div id="abs()">,以便后续通过id实现快速查找。

比如以下代码:

<div id="abs"> 返回一个数的绝对值。 参数可以是整数、浮点数或任何实现了 __abs__() 的对象。 如果参数是一个复数,则返回它的模。
</div>

(二)使用获取用户在input框输入的字符,每输入一个字符就马上开始字符串匹配,字符串匹配从左到右匹,程忽略字母大小写,并把匹配到的结果用javascript的document.createElement("label")动态生成多个label标签作为下拉列表。主要代码如下:

function chooseMenu() {
            //获得输入框的值
            var str = document.getElementById("input").value;
            //获得标签名为div的数组,把首地址给divs
            var divs = document.getElementsByTagName("div");
            var div_di;
            var templabel;
            var _style_top = 0;
            //把choose层里面的子节点清空
            clearAllNode($("choose"));
            if (str != "") {
                //如果输入框的值不为空,执行以下循环
                for (var i = 2; i < divs.length; i++) {
                    //getAttribute方法获得divs[i]节点属性id的值
                    div_id = divs[i].getAttribute("id");
                    //如果字串str在主串div_id中出现在第0个位置则添加一个innerHTML为div_id的div到
                    //choose层
                    if (div_id.toLowerCase().indexOf(str.toLowerCase()) == 0) {
 
                        templabel = document.createElement("label");
                        templabel.className = "suggestions";
                        templabel.innerHTML = div_id;
                        templabel.style.visibility = "visible";
                        templabel.style.top = _style_top * 20 + "px";
                        templabel.style.position="absolute"
                        $("choose").appendChild(templabel);
                        _style_top++
                    }
                }
                //添加完choose层的元素后更新show层的元素
                if ($("choose").firstChild) {
                    show($("choose").firstChild.innerHTML);
                    $("choose").firstChild.style.backgroundColor = "ccc";
                    count = 0;
                } else {
                    show("");
                    $("choose").innerHTML = "couldn't find";
                }
            } else {
                show("");
            }
        }

(三)监听键盘的↑和↓事件,调用键盘事件处理函数,在label前后兄弟节点键来回移动。并更新右侧详细信息页中的内容。

1)使用<body οnkeydοwn="handleUpAndDown()">,为整个页面添加键盘监听事件。<body οnkeydοwn="handleUpAndDown()">

2)编写handleUpAndDown(evt)键盘响应函数,这里需要注意的是charCode=38为键盘↑键,charCode=40为键盘↓键。当charCode为38时调用moveUp()函数,当charCode为40时调用moveDown()函数。moveDown()和moveUp()各自实现左侧Label上下移动效果。

function moveUp() {
            var labels = document.getElementsByTagName("label");
            if (count != 0) {
                labels[count].style.backgroundColor = "#fff";
                labels[count - 1].style.backgroundColor = "#ccc";
                show(labels[count - 1].innerHTML);
                $("input").value = labels[count - 1].innerHTML;
                count = count - 1;
            }
        }
 
        function moveDown() {
            var labels = document.getElementsByTagName("label");
            if (count != labels.length - 1) {
                labels[count].style.backgroundColor = "#fff";
                labels[count + 1].style.backgroundColor = "#ccc";
                show(labels[count + 1].innerHTML);
                $("input").value = labels[count + 1].innerHTML;
                count = count + 1;
            }
        }
 
        function handleUpAndDown(evt) {
            evt = (evt) ? evt : event;
            var charCode = (evt.charCode) ? evt.charCode :
                ((evt.which) ? evt.which : evt.keyCode);
            if (charCode == 38)
                moveUp();
            if (charCode == 40)
                moveDown();
        }

3)使用οnkeyup="handleKeyUpEvent(event),为Input输入框绑定键盘事件,代码如下:<input type="text" name="input" id="input" maxlength="10" style="width:100px;height:20px;"οnkeyup="handleKeyUpEvent(event)">

输入你想查找的指令,可按键盘↑和↓移动指令

4)编写handleKeyUpEvent(evt),避免用户在Input输入框输入文字时受到刚才添加的键盘事件干扰。

function handleKeyUpEvent(evt) {//用来处理键盘事件的函数
            evt = (evt) ? evt : event;
            var charCode = (evt.charCode) ? evt.charCode :
                ((evt.which) ? evt.which : evt.keyCode);
            if (charCode == 38 || charCode == 40 || charCode == 37 || charCode == 39) {
                
            } else {
                chooseMenu();
            }
        }

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值