如何正确编写此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'的元素除了输入类型按钮,提交,提交,隐藏,重置,文件,图像和搜索。
答案 0 :(得分:1)
不幸的是,CSS3's :not()
selector一次只允许一个简单的选择器。您收到异常,因为所有:not(input[...])
选择器都是无效的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'])