《javaScript高级程序设计》阅读：8-正则表达式 （2）

<div id="regexp">
    <h1 class="title">正则表达式测试工具</h1>
    <textarea id="userText" class="textBox" placeholder="请在此输入匹配的文本"></textarea>
    <p>
      正则表达式:
      <input type="text" id="userRegExp" placeholder="请在此输入正则" class="textfield">
      <input type="checkbox" name="userModifier" value="i">忽略大小写
      <input type="checkbox" name="userModifier" value="g">全局匹配
      <input type="checkbox" name="userModifier" value="m">多行匹配
      <input type="button" id="matchingBtn" value="测试匹配">
    </p>
    匹配结果：
    <textarea id="matchingResult" class="textBox" disabled></textarea>
  </div>

<script>
    var userText = document.getElementById('userText')
    var userRegExp = document.getElementById('userRegExp')
    var userModifier = document.getElementsByName('userModifier')
    var matchingBtn = document.getElementById('matchingBtn')
    var matchingResult = document.getElementById('matchingResult')
    var pattern,
        modifier = ''
    for (var i = 0; i < userModifier.length; i++) {
      userModifier[i].onclick = function () {
        modifier = '';
        for (var j = 0; j < userModifier.length; j++) {
          if (userModifier[j].checked) {
            modifier += userModifier[j].value
          }
        }
      }
    }
    matchingBtn.onclick = function () {
      if (!userText.value) {
        alert('请输入正确的文本');
        userText.focus();
        return
      }
      pattern = new RegExp(userRegExp.value, modifier);
      matchingResult.value = pattern.exec(userText.value) || '没有匹配'
    }
  </script>