1.input，消除空格

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <title>Document</title>
  7. </head>
  8. <body>
  9.     <input type="text" id="input">
  10.     <script>
  11.         var arr = [];
  12.         var input = document.getElementById("input");
  13.         input.onkeyup = function(event){
  14.             if(event.keyCode == 13){
  15.                 arr.push(this.value)
  16.                 console.log(arr)
  17.             }
  18.         }
  19.         //   ^\s+ *
  20.         var str = "   hello world"
  21.         var reg = /^\s+/;
  22.         console.log(str);
  23.         console.log(str.replace(reg,""))
  24.     </script>
  25. </body>
  26. </html>

2.消除前后空格

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var str = "   hello    ";
        var reg  = /^\s+|\s+$/g;
        var arr = [];
        var res =  str.replace(reg,"");
        arr.push(res);
        console.log(arr);
    </script>
</body>
</html>

3.trim()去除字符串前后的空格(面试题)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        /* trim()去除字符串前后的空格  

        /^\s+|\s+$/g  面试题
         */
        var str = "   hello   ";
        var arr = [];
        arr.push(str.trim());
        console.log(arr);
    </script>
</body>
</html>

4.非

将不是字母的字符替换成空

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        /* 非 
        ！
        */
        /* 将不是字母的字符替换成空 */
        var str = "hello2133";
        var reg = /[^a-z]/g
        console.log(str.replace(reg,""))
    </script>
</body>
</html>

5.只获取数字

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var str = "https://movie.douban.com/subject/1292052/";
        /* 只获取数字 */
        var reg = /\d+/;
        /* match */
        var res = str.match(reg);
        console.log(res[0])
    </script>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var str = "https://movie.douban.com/subject/1292052/";
        /* 只获取数字 */
        var reg = /[^\d]/g
        console.log(str.replace(reg,""))
    </script>
</body>
</html>

6.邮箱验证

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <input type="text" placeholder="请输入邮箱" id="email">

    <script>
        var email = document.getElementById("email");
        email.onkeyup=function(event){
            if(event.keyCode==13){
            var value = this.value.trim();
            var reg = /^[\w]+@[0=9a-z]+.[a-z]+$/;
            console.log(reg.test(value));
        }
        }
    </script>
</body>
</html>

7.密码验证

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <input type="text" placeholder="密码" id="pw">;
    <script>
        var pw = document.getElementById("pw");
        pw.onkeyup = function(event){
            if(event.keyCode == 13){
                var value = this.value.trim();
                var reg = /^\d{6}$/;
                console.log(reg.test(value))
            }
        }
    </script>
</body>
</html>

8.账户验证

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <input type="text" placeholder="密码" id="pw">
    <script>
        var pw = document.getElementById("pw");
        pw.onkeyup = function(event){
            if(event.keyCode == 13){
                var value = this.value.trim();
                var reg = /^[a-zA-Z]\d{5,}$/;
                console.log(reg.test(value))
            }
        }
    </script>
</body>
</html>

9.用户名验证

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <input type="text" placeholder="请输入用户名" id="pw">
    <script>
        var pw = document.getElementById("pw");
        pw.onkeyup = function(event){
            if(event.keyCode == 13){
                var value = this.value.trim();
                var reg = /^[a-zA-Z]{1,8}$/;
                console.log(reg.test(value))
            }
        }

    </script>
</body>
</html>

10.评论

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var str = "2200359人评价";
        var reg = /\d+/
    </script>
</body>
</html>

11.字符串分离为数组

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <p id="app">
        导演: 弗兰克·德拉邦特 Frank Darabont&nbsp;&nbsp;&nbsp;主演: 蒂姆·罗宾斯 Tim Robbins /...<br>
        1994&nbsp;/&nbsp;美国&nbsp;/&nbsp;犯罪 剧情
    </p>
    <script>
        // var arr = [1994,"美国","犯罪 剧情"]
        /* 1.获取内容,去除字符串前后尾的空格 */
        var txt = document.getElementById("app").innerHTML.trim();
        /* 2. 通过<br>标签分割字符串为数组,得到数组最后一项,去除前后位空格
           3. 通过/分割字符为数组
        */
        var arr = txt.split("<br>")[1].trim().split("/");
        /* 4.去除数组中每一项 &nbsp; */
        var reg = /&nbsp;/g
        var res = arr.map(item=>item= item.replace(reg,""));
        console.log(res)

    </script>
</body>
</html>