0

この css3 セレクター クエリを正しく記述する方法は?

var elements = document.querySelectorAll("[data-datasource='ds1']:not(input[type='button']):not(input[type='submit']):not(input[type='submit']):not(input[type='hidden']):not(input[type='reset']):not(input[type='file']):not(input[type='image']):not(input[type='search'])");

上記のクエリは構文エラーをスローします。

ボタン、送信、送信、非表示、リセット、ファイル、画像、および検索タイプの入力を除いて、data-datasource='ds1' を持つすべての要素を選択したいと考えています。

4

1 に答える 1

1

残念ながら、CSS3の:not()セレクターでは、一度に1つの単純なセレクターしか使用できません。と属性セレクターの:not(input[...])2つの単純なセレクターが含まれているため、すべてのセレクターが無効なCSS3であるため、例外が発生します。input

代わりにこれを試してください:

var elements = document.querySelectorAll("[data-datasource='ds1']:not(input), input[data-datasource='ds1']:not([type='button']):not([type='submit']):not([type='hidden']):not([type='reset']):not([type='file']):not([type='image']):not([type='search'])");

まだ非常に長いセレクター文字列なので、内訳は次のとおりです。

/* Any elements except input that have this attribute value */
[data-datasource='ds1']:not(input), 

/* Only inputs that have this attribute value, but not any of these types */
input[data-datasource='ds1']:not([type='button']):not([type='submit']):not([type='hidden']):not([type='reset']):not([type='file']):not([type='image']):not([type='search'])
于 2012-06-28T18:45:11.467 に答える