前几天写一个js的时候遇到一个非常诡异的事情,这个问题是这样的,我要获取一个页面的DOM元素的val值,判断这个值是否比某个变量大,这个需求原先数字最大也就是10,现在要改了,可能会更多,这个时候我发现比较大小的判断就出了问题:
代码粘出来:
1 // js弱类型导致的诡异现象,11 > 9 ?false 2 ??function downtest(id){// 现象是当val取到的元素val值是11的时候,11>9结果是false 3 ????// 当前点击下一题的是第几题, 4 ????var val=$("#"+id).attr("val"); 5 ????var valint = parseInt(val);// 如果不把这个变量手动转成数字,当val大于等于10的时候(小于10的时候当做是数字)js就会把它作为一个字符串处理,弱类型语言导致的 6 ????// 如果当前这个题号比已答题数大的话,就让已答数量变成当前题号 7 ????console.log(‘valint: ‘+valint+‘num: ‘+num+(valint>num)); 8 ????console.log(valint+num); 9 ????if (valint>num) {10 ????????document.getElementById("numbers").innerText=valint;11 ????????num=valint;12 ????}else{13 ????????document.getElementById("numbers").innerText=num;14 ????}15 ????var div = $("#"+id);16 ????var n = div.next(); //后一个兄弟17 ????div.hide();18 ????n.show();19 ????a++ ???20 }
当获取到的这个值为11的时候(第四行),被比较的变量是9,按理说11>9的结果应该是true吧,但是打印出来的log显示是false.....我后来查了查资料,自己总结一下,发现如果当获取到的属性值超过或等于10,js就会把这个变量视为字符串处理,而不是在比较时作为数字,
解决的办法就是手动转换为数字(第五行),这个时候再打印出来就是正确的数字对比结果了,比较小的一个小坑吧,记录一下
在js中获取页面元素的属性值时,弱类型导致的诡异事件踩坑记录,
原文地址:https://www.cnblogs.com/zizaiwuyou/p/10538157.html