JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptの正規表現(RegExp)で大文字・小文字を区別せずにマッチングする方法

JavaScriptの正規表現で大文字と小文字を区別せずにパターンマッチングを行いたい場合は、iフラグ(ignore case)を使用します。このフラグを正規表現の末尾に付けるだけで、パターン内の英字が大文字・小文字どちらで書かれていても一致するようになります。

iフラグの基本的な使い方

通常、正規表現 /welcome/ は「Welcome」や「WELCOME」とは一致しません。しかし、次のように /welcome/i と記述することで、大文字・小文字の違いを無視してマッチングできます。

サンプルコード

以下のコードは、iフラグを使った大文字・小文字を区別しないマッチングの実例です。

<html>
   <head>
      <title>JavaScript Regular Expression</title>
   </head>
   <body>
      <script>
         var myStr = "Welcome to the website!";
         var reg = /welcome/i;
         var match = myStr.match(reg);
         
         document.write(match);
      </script>
   </body>
</html>

実行結果

このコードを実行すると、文字列「Welcome to the website!」の中から、大文字で始まる「Welcome」が検出され、次のように出力されます。

Welcome

ポイント解説

  • /welcome/i:スラッシュで囲んだ部分がパターン、末尾の i が大文字・小文字を区別しないためのフラグです。
  • match()メソッド:文字列に対して呼び出すと、パターンに一致した部分を配列として返します。

なお、複数の箇所すべてにマッチさせたい場合は、g フラグ(グローバル検索)を組み合わせて /welcome/gi のように指定すると便利です。

  1. JavaScriptでオートコンプリート(入力補完)機能を実装する方法

    JavaScriptによるオートコンプリートの実装検索フォームなどでユーザーの入力に合わせて候補を自動的に表示する「オートコンプリート(入力補完)」機能は、JavaScriptを使えばライブラリなしでも実装できます。本記事では、配列に格納されたデータを候補として表示し、マウスクリックやキーボード操作で選択できるオートコンプリートの作り方を、完全なサンプルコードとともに解説します。実装のポイントこのサンプルでは以下のような仕組みでオートコンプリートを実現しています。inputイベント:テキストフィールドに入力があるたびに発火し、入力値と前方一致する項目を候補リストとして動的に生成します。キーボー

  2. JavaScriptでテキストを切り替える(トグルする)方法を解説

    JavaScriptを使えば、ボタンをクリックするたびに表示されるテキストを切り替える(トグルする)処理を簡単に実装できます。ここでは、innerHTMLプロパティと条件分岐を組み合わせた、最も基本的なテキスト切り替えの方法をサンプルコード付きで解説します。実装コード例<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1" /> <style>