1

querySelectorAll() メソッドの引数を検証するための非常に基本的な正規表現を作成しました。いくつかのランダムな値について検証され、正常に機能しているようです。

改善できるかどうかを知りたかっただけです。

正規表現によっていくつかの検証が見逃される可能性がありますが、私の主な質問は、私のアプローチ、この正規表現の書き方についてです。また、私は正規表現にかなり慣れていません。パフォーマンスに関して重大な間違いをしている場合は、指摘してください。

var p = /^([A-Za-z0-6]*|\*)?((?:(?:#|\.|:|\[)[-A-za-z0-9()+\s"=|^$*]+)*)$/;

/* 


[A-Za-z0-6]* Type selector
\* Universal selector
#|\.|:|\[ for id,class,attribute and psuedo classes
[-A-za-z0-9()+\s"=|^$*]+ id,class, attribute or pseudo class value


*/

var stringArray = [
"div",
"div:first-child",
"div#id",
"div123",
"h1",
"*.warning",
".warning",
"*#myid",
"#myid",
"p.pastoral.marine",
"h1#chapter1",
"*#z98y",
"a.external:visited",
"a:visited",
"a:focus:hover",
"tr:nth-child(2n+1)",
"tr:nth-child(odd)",
"p:nth-child(4n+4)",
"foo:nth-child(0n+5)",
"foo:nth-child(5)",
":nth-child( 3n + 1 )",
"img:nth-of-type(2n+1)",
"h2:nth-of-type(n+2):nth-last-of-type(n+2)",
"h2:not(:first-of-type):not(:last-of-type)",
"h1[title]",
'span[class="example"]',
'span[hello="Cleveland"][goodbye="Columbus"]',
'a[hreflang|="en"]',
'object[type^="image"]',
'a[href$=".html"]',
'p[title*="hello"]'
];
4

1 に答える 1

0

セレクターを検証する最も簡潔で信頼できる方法querySelectorAllは、関数自体を呼び出して、スローされるかどうかを確認することです。

const validateSelector = selector => {
  try { document.querySelectorAll(selector) }
  catch { return false }
  return true;
}

console.log(validateSelector('abc!?#&^123')); // false
console.log(validateSelector('div > text')); // true

于 2020-07-26T00:55:41.447 に答える