我正在寻找下表的CSS选择器:
Peter | male | 34
Susanne | female | 12
是否有任何选择器来匹配所有包含“男性”的td ?
当前回答
到2021年1月，有一些东西会做到这一点。:有()……只有一个问题:目前还没有任何浏览器支持这个功能
示例:下面的选择器只匹配直接包含子元素的元素:
a:has(> img)
引用:
https://developer.mozilla.org/en-US/docs/Web/CSS/:has
https://caniuse.com/?search=has
其他回答
如果你使用的是Chimp / Webdriver。io，他们支持比CSS规范更多的CSS选择器。
例如，这将点击第一个包含“坏熊”字样的锚:
browser.click("a*=Bad Bear");
如果我没看错说明书的话，没有。
您可以在元素上匹配元素中属性的名称和元素中命名属性的值。但是，我没有看到任何用于匹配元素中的内容的东西。
这个问题的语法看起来像Robot Framework语法。 在本例中，虽然没有用于contains的css选择器，但可以使用SeleniumLibrary关键字来代替。 Wait Until元素包含。
例子:
Wait Until Element Contains | ${element} | ${contains}
Wait Until Element Contains | td | male
做这样的小过滤器:
var searchField = document.querySelector('HOWEVER_YOU_MAY_FIND_IT')
var faqEntries = document.querySelectorAll('WRAPPING_ELEMENT .entry')
searchField.addEventListener('keyup', function (evt) {
var testValue = evt.target.value.toLocaleLowerCase();
var regExp = RegExp(testValue);
faqEntries.forEach(function (entry) {
var text = entry.textContent.toLocaleLowerCase();
entry.classList.remove('show', 'hide');
if (regExp.test(text)) {
entry.classList.add('show')
} else {
entry.classList.add('hide')
}
})
})
看起来他们是在考虑CSS3规范，但它没有被削减。
:contains() CSS3选择器http://www.w3.org/TR/css3-selectors/#content-selectors
