JavaScript 中的正则表达式（Regex）修饰符

2025年3月18日 | 阅读 9 分钟

JavaScript 的正则表达式修饰符用于通过元字符和其他正则表达式来控制和操作输入数据。修饰符与元字符和量词配合使用以获取特定字段。search()、match()、test()、exec() 方法在 JavaScript 中与正则表达式修饰符配合使用。三个修饰符与 JavaScript 正则表达式方法一起使用。我们可以设置全局句子、不区分大小写以及其他多行量词。

正则表达式修饰符的类型

三个修饰符通过 JavaScript 方法在正则表达式中运行。此修饰符用于操作带输入字符串的正则表达式信息。

g 修饰符：该修饰符匹配并搜索全局输入信息。
i 修饰符：该修饰符匹配并搜索输入信息的、不区分大小写的字符。
m 修饰符：多行匹配，该修饰符匹配、搜索输入信息的多行字符。

Js g (全局) 修饰符

此修饰符为所需的正则表达式搜索全局信息。我们可以在正则表达式模式中与其他修饰符一起使用全局修饰符。

语法

语法使用全局修饰符与使用输入字符串的正则表达式。

描述

g 修饰符是正则表达式模式的可选值，但对于整个字符串是必需的。

示例

以下示例将测试和匹配是否使用全局修饰符。

示例 1

以下示例匹配基本全局修饰符。我们可以看到全局修饰符的操作。

<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp g modifier
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h2>JavaScript Regular Expressions with g modifier </h2>
<p> The modifiers help to search a global for "java" in a string:</p>
<p id = "demo"></p>
</div>
<script>
let text_input = "TpointTech website : the Javascript works to operate javascript methods";
//use regex global modifier with the match method
let pattern_global = /java/g; 
let result_global = text_input.match(pattern_global);
//output shows available values
document.getElementById("demo").innerHTML = result_global;
</script>
</body>
</html>

输出

输出显示了输入数据中可用的正则表达式字符。

Regular Expression (Regex) Modifier in Javascript

示例 2

以下示例匹配基本全局修饰符。我们可以看到使用全局修饰符和不使用全局修饰符的区别。

<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp g modifier
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h2> JavaScript Regular Expressions with g modifier </h2>
<p> difference between with or without g modifier </p>
<p id = "demo_global"> </p>
<p id = "demo_globals"> </p>
</div>
<script>
//use regex global modifier with the match method
let text_input = "TpointTech website : the Javascript works to operate javascript methods";
let pattern_global = /java/g; 
let result_global = text_input.match(pattern_global);
document.getElementById("demo_global").innerHTML = result_global;
//use regex pattern without global modifier
let pattern_global1 = /java/; 
let result_global1 = text_input.match(pattern_global1);
document.getElementById("demo_globals").innerHTML = result_global1;
</script>
</body>
</html>

输出

输出显示了输入数据中的全局正则表达式修饰符字符。

示例 3

以下示例测试基本全局修饰符。test() 方法显示了正则表达式值的可用性。

<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp g modifier
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h2> JavaScript Regular Expressions with g modifier </h2>
<p> difference between with or without g modifier </p>
<p id = "demo_global"> </p>
</div>
<script>
let text_input = "TpointTech website : the Javascript works to operate javascript methods";
//use regex global modifier with the test method
let pattern_global = /java/g; 
let result_global = pattern_global.test(text_input);
document.getElementById("demo_global").innerHTML = result_global;
</script>
</body>
</html>

输出

输出显示了输入数据中的全局正则表达式修饰符字符。

示例 4

以下示例将全局关键字与全局修饰符一起使用。

<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp g modifier
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h2> JavaScript Regular Expressions with g modifier </h2>
<p id = "demo_global"> </p>
</div>
<script>
let text_input = "TpointTech website : the Javascript works to operate javascript methods";
//use regex global modifier with the global keyword
let pattern_global = /java/g; 
let result_global = pattern_global.global;
document.getElementById("demo_global").innerHTML = result_global;
</script>
</body>
</html>

输出

输出显示了全局正则表达式修饰符的可用性。

Js i 修饰符

此修饰符为所需的正则表达式搜索不区分大小写的信息。通常，我们可以将修饰符与全局和多行修饰符一起使用。

语法

语法使用不区分大小写的修饰符与使用输入字符串的正则表达式。

描述

i 修饰符是正则表达式模式的可选值，但对于不区分大小写的字符串是必需的。

示例

以下示例将测试或匹配是否使用区分大小写的修饰符。

示例 1

以下示例匹配基本区分大小写的修饰符。我们可以看到区分大小写修饰符的操作。

<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp i modifier
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h2> JavaScript Regular Expressions with i modifier </h2>
<p> The modifiers help to search a case-insensitive for "java" in a string: </p>
<p id = "demo_case"> </p>
<p id = "demo_case1"> </p>
</div>
<script>
let text_input = "TpointTech website : the Javascript works to operate javascript methods";
//use regex global and case-insensitive modifiers
let pattern_case = /java/gi; 
let result_case = text_input.match(pattern_case);
//output shows the available value in the string
document.getElementById("demo_case").innerHTML = result_case;
</script>
</body>
</html>

输出

输出显示了输入数据中可用的正则表达式字符。

示例 2

以下示例匹配基本不区分大小写的修饰符。我们可以看到使用区分大小写修饰符和不使用区分大小写修饰符的区别。

<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp i modifier
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h2> JavaScript Regular Expressions with i modifier </h2>
<p> difference between with or without i modifier </p>
<p id = "demo_case"> </p>
<p id = "demo_case1"> </p>
</div>
<script>
let text_input = "TpointTech website : the Javascript works to operate javascript methods";
//use regex global and case-insensitive modifiers
let pattern_case = /java/gi; 
let result_case = text_input.match(pattern_case);
document.getElementById("demo_case").innerHTML = result_case;
let pattern_case1 = /java/g; 
let result_case1 = text_input.match(pattern_case1);
document.getElementById("demo_case1").innerHTML = result_case1;
</script>
</body>
</html>

输出

输出显示了输入数据中可用的正则表达式字符。

示例 3

以下示例测试一个重要的不区分大小写的修饰符。我们使用正则表达式同时使用全局和不区分大小写的修饰符。

<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp i modifier
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h2> JavaScript Regular Expressions with i modifier </h2>
<p> The modifiers help to search a case-insensitive for "java" in a string:</p>
<p id = "demo_global"> </p>
</div>
<script>
let text_input = "TpointTech website : the Javascript works to operate Javascript methods";
//use regex global and case-insensitive modifiers
let pattern_global = /java/gi; 
let result_global = pattern_global.test(text_input);
document.getElementById("demo_global").innerHTML = result_global;
</script>
</body>
</html>

输出

输出显示了输入数据中可用的正则表达式字符。

示例 4

以下示例测试一个基本的不区分大小写的修饰符。

<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp i modifier
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h2> JavaScript Regular Expressions with i modifier </h2>
<p> The modifiers help to filter a case-insensitive for "java" in a string:</p>
<p id = "demo_global"> </p>
</div>
<script>
let text_input = "TpointTech website : the Javascript works to operate Javascript methods";
//use regex global and case-insensitive modifiers
let pattern_global = /java/gi; 
let result_global = pattern_global.exec(text_input);
document.getElementById("demo_global").innerHTML = result_global;
</script>
</body>
</html>

输出

输出显示了输入数据中可用的正则表达式字符。

Js m 修饰符

此修饰符为所需的正则表达式搜索多行信息。我们可以使用其他修饰符与使用正则表达式模式的多行修饰符一起使用。

语法

语法使用多行修饰符与使用输入字符串的正则表达式。

描述和规则

“m”修饰符表示多行匹配。
它只影响字符串开头 ^ 和结尾 $ 的行为。
“^”表示字符串在开头匹配。
$ 符号表示匹配字符串的结尾。
当启用“m”设置时，字符 ^ 和 $ 也匹配每行的开头和结尾。

示例

以下示例将测试和匹配是否使用多行修饰符。

示例 1

以下示例匹配基本多行修饰符。我们可以看到带修饰符的多行信息的操作。

<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp m modifier
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h2> JavaScript Regular Expressions with m modifier </h2>
<p> The modifiers help to search a multiline data of the "java" in a string:</p>
<p id = "demo_case"> </p>
</div>
<script>
let text_input = `TpointTech website : 
the Javascript works 
to operate 
javascript methods`
//use regex global and multiline with the match method
let pattern_case = /java/gm; 
let result_case = text_input.match(pattern_case);
document.getElementById("demo_case").innerHTML = result_case;
</script>
</body>
</html>

输出

输出显示了输入数据中可用的正则表达式字符。

示例 2

以下示例匹配基本多行修饰符。我们可以看到使用多行修饰符和不使用多行修饰符的区别。

<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp m modifier
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h2> JavaScript Regular Expressions with m modifier </h2>
<p> Difference between global and case-insensitive with multiline modifier </p>
<p id = "demo_case"> </p>
<p id = "demo_case1"> </p>
</div>
<script>
let text_input = `Javatopint website : 
the Javascript works 
to operate 
javascript methods`
//use regex global, multiline, and case-insensitive modifiers
let pattern_case = /java/gmi; 
let result_case = text_input.match(pattern_case);
document.getElementById("demo_case").innerHTML = result_case;
//use regex global and multiline modifiers
let pattern_case1 = /java/gm; 
let result_case1 = text_input.match(pattern_case1);
document.getElementById("demo_case1").innerHTML = result_case1;
</script>
</body>
</html>

输出

输出显示了输入数据中可用的必需字符。

示例 3

以下示例测试一个基本的多行修饰符。

<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp m modifier
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h2> JavaScript Regular Expressions with m modifier </h2>
<p> The modifiers help to search a multiline data of the "java" in a string:</p>
<p id = "demo_case"> </p>
</div>
<script>
let text_input = `TpointTech website : 
the Javascript works 
to operate 
javascript methods`
//use regex global and multiline modifiers
let pattern_case = /java/gm; 
let result_global = pattern_case.test(text_input);
document.getElementById("demo_case").innerHTML = result_global;
</script>
</body>
</html>

输出

输出显示了输入数据中可用的必需字符。

示例 4

在下面的示例中，使用多行修饰符检查最后一个单词。我们可以在行尾搜索 method 关键字。

<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp m modifier
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h2> JavaScript Regular Expressions with m modifier </h2>
<p id = "demo_case"> </p>
</div>
<script>
let text_input = `methods of regex modifier : 
the Javascript works 
to operate 
javascript Methods`
//use regex pattern with global, multiline, and case-insensitive modifiers
let pattern_case = /methods$/gmi; 
let result_case = text_input.match(pattern_case);
document.getElementById("demo_case").innerHTML = result_case;
</script>
</body>
</html>

输出

示例 5

以下示例检查基本多行修饰符。

<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp m modifier
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h2> JavaScript Regular Expressions with m modifier </h2>
<p> Check whether a multiline modifier is available or not: </p>
<p id = "demo_case"> </p>
</div>
<script>
let text_input = `TpointTech website : 
the Javascript works 
to operate 
javascript methods`;
//use regex global, multiline, and case-insensitive modifiers
let pattern_case = /java/gmi; 
let result_global = pattern_case.multiline;
//output shows the Boolean value with a multiline keyword
document.getElementById("demo_case").innerHTML = result_global;
</script>
</body>
</html>

输出

输出显示了输入数据中可用的必需字符。

结论

总之，修饰符有助于使用 JavaScript 正确操作输入数据的正则表达式。

下一个主题JavaScript-dispatch-event

JavaScript 中的正则表达式（Regex）修饰符

正则表达式修饰符的类型

Js g (全局) 修饰符

Js i 修饰符

Js m 修饰符

结论

联系信息

关注我们

教程

面试题

在线编译器

Python

Java

.Net Framework

AI, ML and Data Science

Cloud Technology

B.Tech and MCA

Web Technology

PHP

Software Testing

Technical Interview

Java Interview

Python

Web Interview

Database Interview

B.Tech / MCA

Important Interview

Software Testing Interview

Company Interviews

Online Compilers

Multiple Choice Questions

JavaScript 基础

JS 变量和数据类型

JS 控制语句

JavaScript 函数

JavaScript 对象

JS 高级函数

JS Promises & Async/Await

JavaScript DOM

JavaScript JSON 对象

JavaScript 验证

JavaScript Cookies

异常处理

JavaScript 集合

JavaScript 事件

JavaScript OOPs

JavaScript BOM

面试题

选择题

差异

JavaScript Map 方法

JavaScript Handler

JavaScript Number 方法

JavaScript Reflect

JavaScript Symbol

Symbol 属性

JavaScript Math 方法

JavaScript Date 方法

JavaScript DataView

JavaScript Object 方法

JavaScript Set 方法

JavaScript 字符串方法

JavaScript TypedArray 方法

JavaScript WeakMap 方法

JavaScript WeakSet 方法

JavaScript 数组方法

JavaScript RegExp 对象

JavaScript 附加内容

JavaScript 杂项

JavaScript 进阶

问题

Lodash

JavaScript 中的正则表达式（Regex）修饰符

正则表达式修饰符的类型

Js g (全局) 修饰符

Js i 修饰符

Js m 修饰符

结论

相关帖子

JavaScript 通知

JavaScript setAttribute() 方法

谁创造了 JavaScript？

Replit JavaScript

带控制台的 JavaScript 在线编辑器

JavaScript Clear Interval

JavaScript 三元运算符

JavaScript 测试器

JavaScript print() 方法

JavaScript 图像源

订阅 Tpoint Tech

联系信息