Javascript 计算器生成控制台日志,但屏幕上没有显示任何内容

Javascript 计算器生成控制台日志,但屏幕上没有显示任何内容,javascript,jquery,html,calculator,Javascript,Jquery,Html,Calculator,我必须使用JavaScript/jquery构建这个计算器,但是当我按下控制台日志中显示的按钮时,屏幕上不会显示任何数字,不会出现任何错误。我只需要帮助了解如何将数字显示在屏幕上。任何帮助都将不胜感激 函数init(){ console.log('start'); var num1=0; var num2=0; var op=''; var ON=''; $('.digit,.operator orange')。单击(函数(){ var ID=this.ID; console.log(ID);

我必须使用JavaScript/jquery构建这个计算器,但是当我按下控制台日志中显示的按钮时,屏幕上不会显示任何数字,不会出现任何错误。我只需要帮助了解如何将数字显示在屏幕上。任何帮助都将不胜感激

函数init(){
console.log('start');
var num1=0;
var num2=0;
var op='';
var ON='';
$('.digit,.operator orange')。单击(函数(){
var ID=this.ID;
console.log(ID);
计算器(本);
});
函数计算器(obj){
控制台登录;
变量ID=对象ID;
变量类型=对象类列表[1];
如果(类型==‘数字’){
如果(开==真){
$(“#计算”).empty();
}
$('计算').append(ID);
console.log(ID+“!”)
}else if(类型==='operator orange'){
op=obj.textContent;
如果(num1==0){
num1=$(“#计算”).text();
}否则{
num2=$(“#计算”).text();
num1=评估值(num1+op+num2);
}
$(“#计算”).empty();
}else if(类型==='operator orange'){
num2=$(“#计算”).text();
num1=评估值(num1+op+num2);
$(“#计算”).empty();
$('计算')。追加(num1);
开=真;
num1=0;
num2=0;
}else if(类型=='clear'){
$(“#计算”).empty();
num1=0;
num2=0;
开=假;
}
}
}
$(文件).ready(初始化)

计算器
0
  • C
  • /
  • 7
  • 8
  • 9
  • *
  • 4
  • 5
  • 6
  • -
  • 1
  • 2
  • 3
  • +
  • 0
  • =
问题就在这里

$('#calculation').append(num1);
Change.append to.text

问题就在这里

$('#calculation').append(num1);

Change.append to.text

var type=obj.classList[1]
将永远不会返回
数字
,因为该类位于位置0。改为使用属性(
data type=“digit”
)或
classList.contains(“digit”)

使用
类列表。包含

当使用
class
属性来设置目标元素和存储类型或状态时,我建议使用某种前缀,例如
js-
,来区分样式类和交互性

var div1=document.getElementById(“div1”);
var div2=document.getElementById(“div2”);
var div3=document.getElementById(“div3”);
log(“div1,类型为digit:”,div1.classList.contains(“digit”);
log(“div2,类型为digit:”,div2.classList.contains(“digit”);
log(“div3,类型是digit:”,div3.classList.contains(“digit”)
1
2.

3
var type=obj.classList[1]
将永远不会返回
数字
,因为该类位于位置0。改为使用属性(
data type=“digit”
)或
classList.contains(“digit”)

使用
类列表。包含

当使用
class
属性来设置目标元素和存储类型或状态时,我建议使用某种前缀,例如
js-
,来区分样式类和交互性

var div1=document.getElementById(“div1”);
var div2=document.getElementById(“div2”);
var div3=document.getElementById(“div3”);
log(“div1,类型为digit:”,div1.classList.contains(“digit”);
log(“div2,类型为digit:”,div2.classList.contains(“digit”);
log(“div3,类型是digit:”,div3.classList.contains(“digit”)
1
2.

3
如果您使用类似JSFiddle或JSBin:)的东西,将更容易复制和调试
var type=obj.classList[1]
永远不会返回
数字
,因为该类位于
0
位置。请改用属性(
data type=“digit”
)或
classList.contains(“digit”)
。您的解决方案工作正常,感谢您的支持advice@user3297291你能给我一个回复吗?我会接受的。谢谢!我已经发布了我的评论,作为对两个示例的回答。如果您使用JSFIDLE或JSBin:)
var type=obj.classList[1]之类的工具,那么复制和调试会更容易
永远不会返回
数字
,因为该类位于
0
位置。请改用属性(
data type=“digit”
)或
classList.contains(“digit”)
。您的解决方案工作正常,感谢您的支持advice@user3297291你能给我一个回复吗?我会接受的。谢谢!我用两个例子来回答我的评论。我试过了,它仍然只显示在控制台日志中。我试过了,它仍然只显示在控制台日志中