当前位置: 移动技术网 > IT编程>网页制作>Html5 > 【代码笔记】Web-JavaScript-JavaScript正则表达式

【代码笔记】Web-JavaScript-JavaScript正则表达式

2018年12月29日  | 移动技术网IT编程  | 我要评论

一,效果图。

二,代码。

复制代码
<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>javascript 正则表达式</title>
</head>

<body>
    <!--search方法使用正则表达式-->
    <p>搜索字符串"w3cschool",并显示匹配的起始位置</p>
    <button onclick="myfunction()">点我</button>
    <p id="demo"></p>
    <script>
    function myfunction() {
        var str = "visit w3cschool!";
        var n = str.search(/w3cschool/i);
        document.getelementbyid("demo").innerhtml = n;
    }
    </script>
    <!--search方法使用字符串-->
    <p>搜索字符串 "w3cschool", 并显示匹配的起始位置:</p>
    <button onclick="myfunction()">点我</button>
    <p id="demo1"></p>
    <script>
    function myfunction() {
        var str = "visit w3cschool!";
        var n = str.search("w3cschool");
        document.getelementbyid("demo1").innerhtml = n;
    }
    </script>
    <!--replace方法使用正则表达式-->
    <p>替换"microsoft"为"w3cschool</p>
    <button onclick="myfunction()">点我</button>
    <p id="demo3">please visit microsoft</p>
    <script>
    function myfunction() {
        var str = document.getelementbyid("demo3").innerhtml;
        var txt = str.replace(/microsoft/i, "w3cshool");
        document.getelementbyid("demo3").innerhtml = txt;
    }
    </script>
    <!--replace方法使用字符串-->
    <p>替换"microsoft"为"w3cschool"</p>
    <button onclick="myfunction()">点我</button>
    <p id="demo4">please visit microsoft</p>
    <script>
    function myfunction() {
        var str = document.getelementbyid("demo4").innerhtml;
        var txt = str.replace(/microsoft/i, "w3cschool");
        document.getelementbyid("demo4").innerhtml = txt;
    }
    </script>
    <!--使用 test()-->
    <script>
    var patt1 = new regexp("e");

    document.write(patt1.test("the best things in life are free"));
    </script>
    <!--使用 exec()-->
    <script>
    var patt1 = new regexp("e");
    document.write(patt1.exec("the best things in life are free"));
    </script>
</body>

</html>
复制代码

 

参考资料:《菜鸟教程》

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网