背景情報: CSS セレクターを使用してドキュメントの DOM ツリーを分析できるプログラムを作成しています。古いブラウザーをサポートする必要があるため、querySelectorAll を使用できません。最新のブラウザーでもバグが発生する傾向があり、十分に強力ではありません。つまり、独自の CSS セレクター エンジン/パーサーを作成する必要があります。
次の正規表現があります。
var expression = /([^(>\+~)\\\(\)|^(>\+~)\\\[\]]+|\([^\)]+\)|\[[^\]]+\]|\\\.)+/g;
以前は、セレクターを [祖先、コンビネーター、子孫] の形式でセクションに分割していました。使用例:
var selector = 'div[class]>a~p';
var parts = selector.match(expression);
残念ながら、私が得る出力は次のとおりです。
// parts: ['div[class]', 'a', 'p'];
出力を次のようにしたいと思います。
// parts: ['div[class]', '>', 'a', '~', 'p'];
問題は、式がコンビネータを食べるのを防ぐ方法がわからないことです。何かアドバイス？前もって感謝します。