html计算器_用python在前端页面写一个计算器

最新推荐文章于 2024-05-01 15:14:22 发布

weixin_39676979

最新推荐文章于 2024-05-01 15:14:22 发布

阅读量191

点赞数

文章标签： html计算器 js计算器代码加减乘除用html设计一个logo页面用javascript写一个食堂菜单用java实现一个计算器程序用java编写一个计算器

1. brython

Brython（Browser Python）是在浏览器中运行的Python 3的实现，具有 DOM 元素和事件的接口,它的目标是代替javascript。虽然我不认为brython可以替代javascript在前端交互地位，但是，对于并不复杂的页面功能，如果你对学习javascript并不感兴趣，那么可以考虑使用brython。这样，前端后端都可以统一为python语言，应该可以减少一些学习成本。本文将介绍如何用brython在前端实现一个简易的计算器

2. 先制作出网页

不管前端技术如何变革，页面仍然要使用html语言来实现，我们先来制作一个简单的页面

<!DOCTYPE html>

实际运行效果如下

3. 增加brython代码

需要进行三处改动

3.1 引入brython.min.js

使用brython无需进行安装，只需要在页面里引入它的引擎即可

3.2 初始化

<body onload="brython()">

当整个body加载结束后，需要进行python环境的初始化

3.3 处理点击事件

在head 与 body 标签之间增加脚本代码

<script type="text/python">
from browser import document, html
result = document["result"]     # 通过id获得控件

def action(event):
    element = event.target   # 获得被点击的对象
    value = element.text     # 获得被点击控件的值
    if value not in "=C":    # C是清零， = 是计算结果， 不属于这两种，那么就正常输入计算表达式
        if result.text in ["0", "error"]:
            result.text = value
        else:
            result.text = result.text + value
    elif value == "C":      # 清零
        result.text = "0"
    elif value == "=":      # 计算结果
        try:
            result.text = eval(result.text)
        except:
            result.text = "error"

for button in document.select("td"):
    button.bind("click", action)

</script>

为每一个td标签绑定一个点击事件，根据被点击的td标签的值进行相应的处理，现在，直接在浏览器里打开编辑好的页面，就可以使用计算器了。

weixin_39676979

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
html计算器_用python在前端页面写一个计算器

1. brythonBrython（Browser Python）是在浏览器中运行的Python 3的实现，具有 DOM 元素和事件的接口,它的目标是代替javascript。虽然我不认为brython可以替代javascript在前端交互地位，但是，对于并不复杂的页面功能，如果你对学习javascript并不感兴趣，那么可以考虑使用brython。这样，前端后端都可以统一为python语言，应该...
复制链接

扫一扫