如何使用HTML，CSS和JavaScript创建 二进制计算器？

HTML或超文本标记语言以及CSS(级联样式表)和JavaScript可用于开发可执行某些功能的交互式用户应用程序。同样, 可以完全使用HTML, CSS和JS开发二进制计算器。

二进制计算器：

• 对二进制数执行算术运算。
• 二进制计算器的缓冲区限制为8位。
• 如果算术运算的结果超过8位, 则多余的位将被截断。
• 算术运算是使用JavaScript函数完成的。

该应用程序包括：

• 一个显示屏, 在该显示屏上可以显示用户输入以及算术运算的结果。
• 两个按钮0和1用于输入。
• +, –, *, /和Calculate按钮用于对输入执行算术运算。 Calculate按钮与JavaScript函数calculate()绑定。
• 单击”计算”按钮时, 将触发compute()函数, 并解析”输出”部分中的HTML。

第一个数字和第二个数字是通过拆分字符串获得的, 最后, 它们使用parseInt()转换为整数。

• parseInt()方法接受两个参数, 第一个参数是要转换为整数的字符串, 第二个参数是基值, 在这种情况下为2或二进制。根据用户选择的加, 减, 乘或除运算符执行算术运算。
• input()函数接收来自用户的输入, 并将其显示在屏幕上。
• backspace()函数删除显示的字符串的最后一个字符。
• cls()函数可清除显示屏。以下代码段实现了二进制计算器。

例子：

1. 用户提供输入后, 输入将保留在HTML格式的”输出”部分中。声明了一个全局变量scr, 所有JavaScript函数都可以访问它。给定任何输入后, 它将存储在scr变量中。
2. 单击”计算”按钮时, 使用indexOf()方法搜索存储在scr变量中的字符串是否存在运算符, 如果找到则返回运算符的索引, 否则返回-1。如果存在运算符, 则存储在scr变量中的字符串将在运算符(+, -, *, /)处拆分, 并将字符串存储到num数组中。
3. 由于输入为字符串格式, 因此必须将其转换为二进制整数格式才能执行计算。使用parseint(str, base)方法解析字符串, 其中str是要转换的字符串, 而base是数字的底数(此处二进制base = 2)。
4. 二进制转换后, 将执行指定的算术运算, 并将结果再次存储在scr变量中并显示在”输出”部分中。

具体实现代码：

     
         
         
        
         
         
  
         
     
  
     
         

             

                 
Binary Calculator
                 

                 

                     

                         

                             0
                             1
                             AC
                             Backspace
                         
                     
                     

                         

                             +
                             -
                             *
                             /
                         
                     
                     

                         

                             Calculate
                         
                     
                 
             
         
  
         
  
         
         
         
     

实现结果展示：