JavaScript ノートのフォームと正規表現

正規表現は、テキスト文字列を検証して書式設定するための非常に強力な方法です。正規表現を使用すると、正規表現を使用しない場合は数十行のコードが必要となる複雑なタスクを、1 行または 2 行の JavaScript コードで完了できます。
正規表現とは、1 つまたは複数のテキスト文字列を記述する特殊な記号で記述されたパターンです。これはプログラミングの最も難しい部分の 1 つと考えられていますが、複雑な正規表現を意味のある小さな塊に分割するだけです。その構文は次のとおりです。理解するのは難しくありません。 ️次の例は、正規表現を使用してメール アドレスを検証するために使用できます:
[html]

;title> ;メールの検証

someAction.cgi">

script01.css
[css]
body {
color: #000;
背景色: #FFF;

input.invalid {

背景色: # FF9;

ボーダー: 2px 赤インセット


label.invalid {
フォントの太さ: 太字
;

script01.js
[javascript]
window.onload = initForms; 

function initForms() {
for (var i=0; i document.forms[i].onsubmit = function() {return validForm();}
}
}

function validForm() {
var allGood = true; 
var allTags = document.getElementsByTagName("*"); 

for (var i=0; i if (!validTag(allTags[i])) {
allGood = false; 
}
}
すべて良いを返します。 

function validTag(thisTag) {
var outClass = ""; 
var allClasses = thisTag.className.split(" "); 

for (var j=0; j outClass += validBasedOnClass(allClasses[j]) + " "; 
}

thisTag.className = outClass; 

if (outClass.indexOf("invalid") > -1) {
validLabel(thisTag.parentNode); 
thisTag.focus(); 
if (thisTag.nodeName == "INPUT") {
thisTag.select(); 
}
falseを返します。 
}
trueを返します。 

function validBasedOnClass(thisClass) {
var classBack = ""; 

switch(thisClass) {
case "":
case "無効":
ブレーク; 
case "メール":
if (allGood && !validEmail(thisTag.value)) classBack = "invalid "; 
デフォルト:
classBack += thisClass; 
}
return classBack; 
}

function validEmail(email) {
var re = /^w+([.-]?w+)*@w+([.-]?w+) *(.w{2,3})+$/; 

           return re.test(メール); 
}

function validLabel(parentTag) {
if (parentTag.nodeName == "LABEL") {
                parentTag.className += "無効"; 
}
}
}
}

それでは、コードの赤い行を説明しましょう:
正規表現は常にスラッシュ (/) で始まり、終わります。
キャレット (^) は、この式を使用して特定の文字列で始まる文字列をチェックすることを示します。
式 w は、a~z、A~Z、0~9、アンダースコアなどの任意の 1 文字を表します。
プラス記号 + は、前のエントリの 1 つ以上の出現を検索することを意味します。表示前括弧 (グループを示します。
角括弧 [] は、表示される文字を示すために使用されます。この角括弧には .- という文字が含まれていますが、ドット番号は正規表現にとって特別な意味を持つため、次のようにする必要があります) in it in it バックスラッシュが前にある場合、特別な文字列の前にバックスラッシュを使用することは、「文字エスケープ」と呼ばれます
期間を設定すると表示されない場合があります。または、疑問符の後にもう一度 w+ を使用して、ピリオドまたはハイフンの後に他の文字が必要であることを示します。これは、前のエントリを含める必要がないことを示します。または複数回表示されます。
@ 文字はそれ自体を表すだけであり、他の意味はありません。
次に、w+ は、ドメイン名が 1 つ以上の a~z、A~Z、0~9、またはアンダースコアで始まる必要があることを示します。これには、([.-]?w+)* も続きます。これは、電子メール アドレスの接尾辞にドットまたはハイフンを使用できることを意味します。次に、.w{2,3} のように、別のグループを作成します。 . は、ドットを検索することを示し、その後にいくつかの文字が続きます。中括弧内の数字は、前のエントリが 2 回または 3 回出現する可能性があることを示します。
正規表現の末尾はドル記号であり、一致することを示します。ここで終了です

Return re.test(email); この行は、前のステップで定義された正規表現を取得し、test() メソッドを使用して電子メールの有効性を検証します
を使用しない場合正規表現の場合は、同じコードを完成させるために数十行のコードを使用します
[javascript]
function validEmail(email) {
var validChars = " /:,;";
}
for (var k=0; k＆lt; nivalidchars.length） = -1）{falseを返す;true を返す。本当に多くのコードが削減されます。