JS练习笔记(3)--判断数字是否为两位数

我是按照实例索引写的第三课的第6个练习,同样是和源码写的区别比较大。
需要达到的效果为
JS练习笔记(3)--判断数字是否为两位数_第1张图片
JS练习笔记(3)--判断数字是否为两位数_第2张图片
JS练习笔记(3)--判断数字是否为两位数_第3张图片

我的思路是将输入的数字转换为数组,然后获得数组的长度来判断是否为2位数。

    <script type="text/javascript">
        window.onload = function () {
            var input = document.getElementsByTagName('input')[0];
            var btn = document.getElementsByTagName('button')[0];
            input.onkeyup = function (){
                this.value = this.value.replace(/[^\d]/,"")
            }
            btn.onclick = function() {
                var arr = input.value.split('');
                if(arr.length == 2){
                    alert('√这是2位数');
                }else{
                    alert('这是'+arr.length+"位数");

                }

            }
        }
    script>
    <body>
        <div class = 'outer'>
            <input type = 'text'>
            <button>是否为两位数button>
        div>
    body>

作者大大的源码为:


window.onload = function ()
{
    var aInput = document.getElementsByTagName("input");
    var aSpan = document.getElementsByTagName("span")[0];
    var i = 0;

    aInput[0].onkeyup = function () //不是数字的输入删除
    {
        this.value = this.value.replace(/[^\d]/,"")
    }

    aInput[1].onclick = function ()
    {
        (aInput[0].value == "") ?
        alert("请输入数字!") :
        alert(/^\d{2}$/.test(parseInt(aInput[0].value)) ? "√ 是两位数" : "这是" + aInput[0].value.length + "位数");
    }
};

大大通过三元表达式来进行判断。自己总是想不出来用三元表达式(ಥ_ಥ)

(aInput[0].value == "") ?
        alert("请输入数字!") :
        alert(/^\d{2}$/.test(parseInt(aInput[0].value)) ? "√ 是两位数" : "这是" + aInput[0].value.length + "位数");

先是判断里面的/^\d{2}$/.test(parseInt(aInput[0].value)) ? "√ 是两位数" : "这是" + aInput[0].value.length + "位数";通过正则表达式判断输入的数字是否是2位数,是则显示"√ 是两位数",否则显示"这是" + aInput[0].value.length + "位数";我才意识到 input的value 是 string类型,那么不需要转为数组就知道其长度啦。所以我写的多此一举了….而且也忽视了判断是否输入为零。

你可能感兴趣的:(javascript)