//添加计算器元素 class Calculator { constructor(containerClass = "counter") { this.containerClass = containerClass; this.symbols = [" ","c","D","%","/","1","2","3","*","4","5", "6","-","7","8","9","+","00","0",".","="]; this.initCalculators(); } // 初始化所有计算器容器 initCalculators() { const containers = document.getElementsByClassName(this.containerClass); Array.from(containers).forEach((container, index) => { this.createCalculator(container, index); }); } // 创建单个计算器 createCalculator(parent, index) { // 创建输入框 const input = this.createInput(index); parent.appendChild(input); // 创建按钮 let brCount = 0; this.symbols.slice(1).forEach((symbol, i) => { if (i % 4 === 0) { parent.appendChild(this.createBr(brCount++)); } const btn = this.createButton(symbol, index); parent.appendChild(btn); }); // 添加样式 this.applyStyles(index); } // 创建输入框 createInput(index) { const input = document.createElement("input"); input.className = "show"; input.id = `show${index}`; input.type = "text"; return input; } // 创建换行 createBr(count) { return document.createElement("br"); } // 创建按钮 createButton(symbol, index) { const btn = document.createElement("button"); btn.className = "button"; btn.id = symbol === "00" ? `buttonT${index}` : `button${symbol}${index}`; btn.textContent = symbol; btn.addEventListener("click", (e) => this.handleClick(e, index)); return btn; } // 应用样式 applyStyles(index) { const buttons = document.querySelectorAll(`#button${index}`); buttons.forEach(btn => { btn.style.cssText = "width:50px;height:50px;padding:0;margin:0;"; }); const input = document.getElementById(`show${index}`); input.style.cssText = "width:198px;height:48px;padding:0;margin:0;border:1px solid black;"; } // 点击事件处理 handleClick(event, index) { const target = event.target; const input = document.getElementById(`show${index}`); // 处理特殊按钮 switch(target.textContent) { case "c": input.value = ""; break; case "D": input.value = input.value.slice(0, -1); break; case "=": input.value = this.calculate(input.value); break; default: input.value += target.textContent; } } //计算部分 // 修改后的计算逻辑 calculate(expression) { try { // 处理特殊符号和格式 let expr = expression .replace(/(\d+(\.\d+)?)%/g, '($1/100)') // 转换百分号为小数 .replace(/00/g, '0'); // 处理双零输入 // 安全验证（仅允许数字和运算符） if (!/^[\d+\-*/()./%\s]*$/.test(expr)) { return "错误：无效输入"; } // 处理除以零的情况 if (expr.includes('/0') && !expr.includes('/0.')) { return "错误：除以零"; } // 使用JavaScript内置计算 const result = eval(expr); // 格式化结果（最多保留12位小数） return parseFloat(result.toFixed(12)); } catch (e) { return "错误：无效表达式"; } } } 这个代码如何在html中引用