• web概述11


    使用js
    DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Documenttitle>
        <script type="text/javascript" src="js/test.js">script>
        <script type="text/javascript">
            function showMsg() {
                window.alert("这是一个消息");
            }
        script>
    head>
    
    <body>
        <p>1、在需要使用本步的地方<script> p>
        <select>
            <script type="text/javascript">
                for (i = 1980; i < 2015; i++) {
                    document.write(" + i + "");
                }
            script>
        select>
    
        <p>2、在需要使用脚本时,将外部js文件引入,并调用它p>
        <input type="button" onclick="showTime();showMsg();" value="显示当前时间" />
        <span id="sp">15:30span>
    
        <p>3、在标签的事件属性中直接写脚本p>
        <input type="button" onclick="window.alert('将要关闭窗口');window.close();window.opener=null;" value="关闭窗口" />
    
        <p>4、可以在a标签的href方法中写入脚本p>
        <a href="javascript:window.alert('没有要删除的东西');">删除a>
    body>
    
    html>
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    事件机制
    DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Documenttitle>
        <style type="text/css">
            .title {
                margin: 20px;
                font-weight: bold;
                color: 16px;
                border-bottom: 1px solid #ccc;
                padding-top: 10px;
            }
    
            .content {
                font-size: 14px;
                background-color: #eee;
                margin-top: 10px;
                padding: 5px;
            }
        style>
        <script type="text/javascript">
            //封装document.getElementById,使用更方便
            function $(id) {
                return document.getElementById(id);
            }
    
            function loadOver() {
                $("btn2").onclick = function () {
                    alert("按钮2被点击了");
                };
            }
        script>
    
        <head>
    
        <body>
            <div class="title" onclick="alert('title div被点击了')">
                1、事件
                <div class="content" onclick="alert('content div被点击了')">
                    <input type="button" value="按钮" onclick="alert('按钮被点击了')" />
                div>
            div>
    
            <div class="title">
                2、鼠标事件
                <script type="text/javascript">
                    function showMenu(event) {
                        if (event.button != 2) {//不是右键
                            return;
                        }
                        document.getElementById("menu").style.display = "block";
                        $("menu").style.top = (event.clientY + 10) + "px";
                        $("menu").style.left = (event.clientX + 10) + "px";
                    }
                    function showPosi(e) {
                        $("posi").innerHTML = e.clientX + "," + e.clientY;
                    }
                script>
                <div class="content" onmousemove="showPosi(event)">
                    <input type="button" value="单击触发" onclick="alert('鼠标单击')" />
                    <input type="button" value="双击删除" ondblclick="this.parentNode.removeChild(this)" />
                    <input type="button" value="右键菜单" oncontextmenu="return false;" onmousedown="showMenu(event)" />
                    <br /><br />
                    <img src="imgs/1.gif" onmouseover="this.src='imgs/2.gif'" onmouseout="this.src='imgs/1.gif'" />
                    <br /><br />
                    <span id="posi">span>
                div>
                <div id="menu" style="display:none;position:fixed;" onclick="this.style.display='none'">
                    <a href="#">新建a><br />
                    <a href="#">删除a><br />
                    <a href="#">修改a><br />
                    <a href="#">退出a>
                div>
            div>
    
    
            <div class="title">
                3、键盘事件
                
                <div class="content">
                    查看按键值:<input type="text" onkeydown="this.value=event.keyCode" />
                    <input type="text" onkeypress="this.value=event.keyCode" />
                div>
            div>
    
    
            <div class="title">
                4、HTML事件
                <div class="content">
                    <img src="123123" onerror="this.src='imgs/1.gif'" />
                    select:<input type="text" value="abcd" onselect="alert(this.value)" />
                    focus:<input type="text" onfocus="this.value='获得焦点'" />
                    blur:<input type="text" onblur="this.value='失去焦点'" />
                    change:<input type="text" onchange="alert(this.value)" />
                div>
            div>
    
    
            <div class="title">
                5、访问事件对象
                <script type="text/javascript">
                    function showPosIE() {
                        var e = window.event;
                        alert(e.clientX + "," + e.clientY);
                    }
                    function showPosFire() {
                        var e = arguments[0];
                        alert(e.clientX + "," + e.clientY);
                    }
                    function stopMenu() {
                        window.oncontextmenu = function (event) {
                            //event.returnValue=false;
                            event.preventDefault();
                        }
                        //从事件对象中获取事件源,也就是标签dom引用
                        var eSource = null;
                        if (window.event) {
                            eSource = window.event.srcElement;
                        } else {
                            eSource = arguments[0].target;
                        }
                        eSource.value = "已右键禁止";
                    }
                script>
                <div class="content">
                    <input type="button" value="显示鼠标位置(IE)" onclick="showPosIE()" />
                    <input type="button" value="显示鼠标位置(Firefox)" onclick="showPosFire(event)" />
                    <input type="button" value="禁止右键" onmousedown="stopMenu(event)" />
                div>
            div>
    
    
    
            <div class="title">
                6、在HTML元素中绑定事件监听
                <div class="content">
                    <input type="button" value="按钮1" onclick="alert('监听单击事件')" />
                div>
            div>
    
            <div class="title">
                7、在脚本中绑定事件监听
                <script type="text/javascript">
                    //onload当页面加载完成时触发,可以写在body标签中 onLoad="loadOver()"
                    window.onload = function () {
                        $("btn2").onclick = function () {
                            alert("按钮2被点击了");
                        };
                    }
                script>
                <div class="content">
                    <input id="btn2" type="button" value="按钮2" />
                div>
            div>
    
            <div class="title">
                8、动态绑定事件监听
                <script type="text/javascript">
                    function addListener() {
                        $("btn3").onclick = function () {
                            alert("按钮3被点击了");
                        };
                    }
                script>
                <div class="content">
                    <input id="btn3" type="button" value="按钮3" />
                    <input id="btn4" onclick="addListener()" type="button" value="给按钮3添加事件监听" />
                div>
            div>
    
    
    
        body>
    
    html>
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    • 86
    • 87
    • 88
    • 89
    • 90
    • 91
    • 92
    • 93
    • 94
    • 95
    • 96
    • 97
    • 98
    • 99
    • 100
    • 101
    • 102
    • 103
    • 104
    • 105
    • 106
    • 107
    • 108
    • 109
    • 110
    • 111
    • 112
    • 113
    • 114
    • 115
    • 116
    • 117
    • 118
    • 119
    • 120
    • 121
    • 122
    • 123
    • 124
    • 125
    • 126
    • 127
    • 128
    • 129
    • 130
    • 131
    • 132
    • 133
    • 134
    • 135
    • 136
    • 137
    • 138
    • 139
    • 140
    • 141
    • 142
    • 143
    • 144
    • 145
    • 146
    • 147
    • 148
    • 149
    • 150
    • 151
    • 152
    • 153
    • 154
    • 155
    • 156
    • 157
    • 158
    • 159
    • 160
    • 161
    • 162
    • 163
    • 164
    • 165
    • 166
    • 167
    • 168
    • 169
    • 170
    • 171
    • 172
    • 173
    • 174
    • 175
    • 176
    • 177
    • 178
    • 179
    • 180
    数据定义
    DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Documenttitle>
    head>
    
    <body>
        
    
        
        js的数据类型分成值类型和引用类型两大类
            值类型:变量存储的就是值本身,传递的过程就是值复制的过程。
            引用类型:变量并不真实存储值,存储的是值的一个引用,传递的过程是引用复制的过程。
        引用类型也叫做对象类型,对象具有唯一性。
    
        值类型分为5大类型
        1、数字
        2、字符串
        3、布尔类型(逻辑类型:逻辑真和逻辑假)
        4、null(空)
        5、Undefined (未定义)
        空表示有值,但值是空。未定义是压根没有值。
        <script>
            //    var x = 123;
            //    var y = x;
            //    x = 456
            //    document.write(y);
            var wangzhen = { shengao: 180, xingbie: "男" };
            var y = wangzhen;
            y.xingbie = "女";
            document.write(wangzhen.xingbie)
        script>
    body>
    
    html>
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    条件语句
    DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Documenttitle>
    head>
    
    <body>
        <script>
            //    if(bool){
            //
            //    }else{
            //
            //    }
            //    三元表达式(三目表达式)
            //    bool ? 表达式1 : 表达式2
            //    等同于if else语句,
            //    判断bool,为真,执行表达式1
            //    为假,执行表达式2。
    
    
            //    var x = 59.9;
            //    document.write(
            //            x>=60?"您及格了":"您不及格"
            //    );
            //    var txt;
            //    x>=60?txt="您及格了":txt="您不及格";
            //    document.write(txt);
            //    x>=60?x>=85?"优秀":"一般":x>=30?"可以挽救":"需要自救"
            //
            //    x>=85?"优秀":"一般"
            //    x>=30?"可以挽救":"需要自救"
            //
            //    x = 84;
            //    if(x>=60){
            //        if(x>=85){
            //            document.write("优秀");
            //        }else{
            //            document.write("一般");
            //        }
            //    }else{
            //        if(x>=30){
            //            document.write("可以挽救");
            //        }else {
            //            document.write("需要自救");
            //        }
            //    }
            switch (表达式) {
                case1:
                    代码块
                    break;
                default:
                    代码块
                    break;
            }
    //    switch 语句会计算表达式的值,判断是否等于 case 语句的值,如果等于,则执行相应的代码。
    //            如果case 语句中不含有表达式的值则执行 default 语句中的代码。
    //
    //            break用于跳出当前switch。如果没有 break 分割,则会顺序执行后面的case中的语句。
    //    var x = 3;
    //    switch (x){
    //        case 5:
    //            document.write("*");
    //        case 4:
    //            document.write("*");
    //        case 3:
    //            document.write("*");
    //        case 2:
    //            document.write("*");
    //        case 1:
    //            document.write("*");
    //    }
    //    x = 20;
    //    switch (x%10==0){
    //        case true:
    //            document.write("是10的倍数");
    //            break;
    //        default:
    //            document.write("不是10的倍数");
    //            break;
    //    }
        script>
    body>
    
    html>
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    • 86
    • 87
    • 88
    循环结构
    DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Documenttitle>
    head>
    
    <body>
        <script>
            //    for(var i=0;i<10;i++){
            //        document.write(i + "
    ");
    // } // var i=0; // for(;i<10;){ // i++; // document.write(i + "
    ");
    // } // var arr = [1,2,3,4,5]; // for(var i=0;i // document.write(arr[i]+"
    ");
    // } var obj = { a: 1, "b": 2, c: 3 }; x = "b"; document.write( // obj[x] // obj.b // obj["b"] ) // js的for...in循环不是遍历数组,而是遍历对象的属性(方法) // for(var x in obj){ // document.write(obj[x]+"
    ")
    // } // var arr = [1,2,3] // arr.xyz = "值"; //document.write(arr) // for(var x in arr){ // document.write(x + "
    ")
    // } // while 和 do while 的区别 // while 是 先判断再执行 // do while 是 先执行再判断 // 当初始条件就不满足时, // do while 至少会执行一次 // 而 while 则一次都不执行 // var i=100; // while (i<10){ // document.write(i+"
    ");
    // i+=2; // } // var i=100; // do{ // document.write(i+"
    ");
    // i++; // }while (i<10); // break 终止当前循环。 // continue 跳过当次循环,继续执行下次循环。 // continue 必须写在能够保证循环 // 变量改变的位置。 // break continue 他们默认只对当前包裹 // 自己的循环中最内层的 // 起作用。 var i = 0; while (i < 10) { i++; if (i == 5) { continue; } document.write(i + "
    "
    ); } // for(var i=0;i<10;i++){ // if(i==5){ break; // continue; // } // document.write(i+"
    ");
    // }
    script> body> html>
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    异常处理
    DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Documenttitle>
    head>
    
    <body>
        <p>
            js错误处理
            将有可能发生错误的语句,写在try语句中尝试执行,一旦发生错误,立即转到catch语句,catch语句使用一个变量接受错误类型。
            try语句中可以使用throw主动产生一个错误。
    
            try{
            throw "这是我主动产生的错误";
            alert(123);
            }catch (x){
    
            }
        p>
        <input type="button" id="btn" value="点击获取当前日期">
        <div id="txt">div>
        <script>
            var btn = document.getElementById("btn");
            var txt = document.getElementById("txt");
            btn.onclick = function () {
                try {
                    txt.innerHTML = new Date();
                    throw "这是我自己产生的错误"
                    alert(123)
                } catch (e) {
                    alert(e)
                }
            }
        script>
    body>
    
    html>
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    运算符
    DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Documenttitle>
    head>
    
    <body>
        <p>
            1、加号,既是数学运算符,又是字符串的连接符。
            当加号两端出现字符串时,js会将另外一端也转换成字符串连接。
        p>
        <p>
            2、a++  ++a  表示 a = a + 1;<br/>
            a-- --a  表示 a = a - 1;<br/>
            <ul>
                <li>加号放在前表示:先加减,再运算。li>
                <li>加号放在后表示:先运算,再加减。li>
            ul>       
        p>
        <h3>逻辑运算符h3>
        <ul>
            <li>&&  逻辑与(并且)。同真则真li>
            <li>||  逻辑或(或者)。同假则假li>
            <li>!   逻辑非(不是)。非真则假,非假则真li>
        ul>
        <script>
            //    var x = 1;
            //    var y = "2";
            //    var z = 1 + 1 + 1 + "1" + (1 + 1);
            //    document.write(z)
    
            //    var a = 1;
            //    var x = ++a + 1;
            //    document.write(a);
    
            if (!(1 == 2 || 3 == 4 && 1 == 1)) {
                document.write("真")
            } else {
                document.write("假")
            }
        script>
    body>
    
    html>
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    正则表达式
    DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Documenttitle>
    head>
    
    <body>
        <h2>正则式h2>
        <p>
            正则表达式是构成搜索模式search pattern的字符序列。可用于执行所有类型的文本搜索和文本替换操作
        <ul>
            <li>search() 方法用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串,并返回子串的起始位置li>
            <li>replace() 方法用于在字符串中用一些字符串替换另一些字符串,或替换一个与正则表达式匹配的子串li>
            <br />
            <li>test() 方法用于检测一个字符串是否匹配某个模式,如果字符串中含有匹配的文本,则返回 true,否则返回 falseli>
            <li>exec() 方法用于检索字符串中的正则表达式的匹配。该函数返回一个数组,其中存放匹配的结果。如果未找到匹配,则返回值为 null。li>
        ul>
        p>
        <script>
            var txt = "1法-+轮-功是最好的神功,欲练法_轮功,必先自焚"
            var bb = txt.search(/法[^轮]{0,5}/)
            document.write(bb)
            //    txt = txt.replace(/法[^轮]{0,5}轮[^功]{0,5}功/g,"***")
            //    document.write(txt)
            //    var reg = new RegExp("法[^轮]{0,5}轮[^功]{0,5}功","gim");
            //    var reg = /法[^轮]{0,5}轮[^功]{0,5}功/gim;
            //    var txt = "法-+轮-功是最好的神功,欲练法_轮功,必先自焚"
            //    txt = txt.replace(reg,"***")
            //
            //  相关的运行参数有:g全文查找、i忽略大小写、m多行查找
            //
            //    var txt = "我asdhda"
            //    document.write(/[a-z0-9_]{6,18}/i.test(txt))
            //    var txt = "uid=xxx&pwd=123*age=18"
            //    var arr = txt.split(/[&=]/)
            //    document.write(arr)
    
            //    \ 转义字符
            //    []  表示匹配括号内的任意一个字符。它支持0-9这样的区间,指0的unicode编码到9的unicode编码之间连续的所有字符。
            //例如[^0-9]表示除了0-9之外的所有字符中的任意一个字符。
            //  \d	匹配一个数字字符,等效于[0-9]
            //  \D	[^0-9]
            //  \w	匹配包括下划线的任何单个字符,包括AZ,az,0~9和下划线**""**,等效于[a-zA-Z0-9]
            //  \W	[^a-zA-Z0-9_]
            //  \s	匹配任何Unicode空白字符,包括空格、制表符、换页符等,等效于[\f\t\n\r]
            //  \S	[^\f\t\n\r]
    
            //    var txt = "this is a p我g,p2g,pag,pdg...."
            //    txt = txt.replace(/p[^a-z]g/gi,"***")
            //    document.write(txt)
    
            //var txt = "我喜欢的明星有老男人、双胞胎、大锤、老师"
            //txt = txt.replace(/(老[男女]人|双胞胎|大锤|老师)/gi,"***")
            //document.write(txt)
            //
            //    var txt = "this is a pig"
            //    txt = txt.replace(/is\b/g,"are")
            //    document.write(txt)
            //    var txt = "闫峻"
            //    document.write(/^[\u4E00-\u9FA5\uF900-\uFA2D]{2,6}$/.test(txt))
            // var txt = "19903152@@qq.com"
            // var reg = /^\w+@\w+(\.\w+)+$/
            // document.write(reg.test(txt))
        script>
        <hr />
        <div>
            <script>
                var v1 = "12asdfasd12adfasd15dfasdffasdf212asdf";
                var v2 = /12[a-z]{2}/g;  //使用()就是捕获组,可以获取满足条件的所有数据组成的数组
                var aa = v2.exec(v1);
                var bb = v2.test(v1);
                document.write("第一个匹配数据===", aa, ",没有匹配的则返回null
    "
    ); document.write("输入数据===", aa.input, "
    "
    ); document.write("索引序号===", aa.index, "
    "
    ); document.write(v1, "===", bb, "
    "
    ); console.log(aa);
    script> div> body> html>
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    正则表达式校验
    DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Documenttitle>
        <script>
            function ff(s) {
                var v1 = /^([0]{1}[\d]{2,5}-)?[0-9]{8}$/;
                if (v1.exec(s) == null) {
                    alert("输入的是" + s + "不合法!!");
                    document.fm1.reset();
                } else {
                    alert(s);
                }
            }
        script>
    
    <body>
        <form name="fm1">
            <input name="num" /><input type="button" onclick="ff(fm1.num.value);" value="check" />
        form>
        <hr />
        <script>
            function ff1() {
                var v1 = document.fm2.num2.value;
                var vv = /^[+]?[\d]+[-]?[0-9]+$/;//数字可以用[0-9]
                if (vv.exec(v1) == null) {
                    document.fm2.reset();
                    document.fm2.num2.focus();
                    alert("输入异常!");
                    return;
                } else {
                    document.fm2.submit();
                    alert(eval(v1));
                }
            }
        script>
    
        <body>
            <form name="fm2">
                <input name="num2" /><input type="button" onclick="ff1();" value="加减计算" />
            form>
        body>
    
    html>
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
  • 相关阅读:
    PerfView专题 (第五篇):如何寻找 C# 托管内存泄漏
    精品基于Uniapp+SSM实现的移动端的家庭客栈管理系统实现的App
    Vue3.0 —— setup、ref、reactive和 computed的简介及使用
    2023山东科技大学考研介绍
    推荐5款纯净好用的良心浏览器,实现浏览自由
    Java注解学习与实战
    11 | Spark计算数据文件中每行数值的平均值
    一种清洁机器人设计及仿真
    Java之方法
    提前尝鲜,Android 13首个Beta发布
  • 原文地址:https://blog.csdn.net/weixin_44251806/article/details/127730269