javascript - 無効な css クラス名 (数字で始まる) をテスト/検出するための js 正規表現

Question

無効な css クラス名を取得する解決策を見つけようとしています。私は持っている：

if (/[^A-Za-z0-9_-]+/.test(classname)) {}

名前が css クラスでは許可されていない数字で始まる場合は「true」ではないことを除いて、正常に動作します。だから私は多くのことを試しました：

/[0-9]+[^A-Za-z0-9_-]+/

うまくいきません…何かアイデアはありますか？どうも！

Answer 1

有効なクラス名に文字、数字、ハイフン、またはアンダースコアのみが含まれ、数字で始めることはできないという前提が根底にある場合は、有効な名前に次のような正規表現を使用できます。

/^[a-z_-][a-z\d_-]*$/i

つまり、文字列の先頭に任意の文字、アンダースコア、またはハイフンがあり、その後に文字、数字、アンダースコア、またはハイフンが 0 個以上続き、文字列の末尾まで続きます。

無効かどうかをテストする場合は、次のように使用します。

if (!/^[a-z_-][a-z\d_-]*$/i.test(classname)) {
   // invalid, do something
}

しかし、あなたが説明したことを実装していると思いますが、クラス名はハイフンで始まり、その後に数字が続くとは思われません。おそらく：

if (!/^([a-z_]|-[a-z_-])[a-z\d_-]*$/i.test(classname)) {
   // invalid, do something
}

iフラグを使用して正規表現の大文字と小文字を区別しないようにする方が簡単であることに注意してくださいa-zA-Z。