Могу ли я использовать XPath для фильтрации элементов по свойствам CSS?

Question

Или я должен сделать что-то вроде этого:

var nodes = document.childNodes; 
for (var i in nodes) { 
    if (window.getComputedStyle(nodes[i], null).getPropertyValue('someproperty') == 'somevalue') 
     // do stuff 
} 

Edit:

Я не очень хорошо знакомы с XPath. А «простой» удар на проблему было бы что-то вроде этого:

function test() { 
    var resultSet = document.evaluate("//*[@float='left']", document.body, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); 
    for (var i = 0; i < resultSet.snapshotLength; i++) { 
     var element = resultSet.snapshotItem(i); 
     alert(element); 
    } 
} 

Но удивительно это не работает, так как float это свойство, а не атрибут ...

Answer 1

Как сказал Viet & knut, вы можете перейти с помощью селекторов атрибутов & строки, соответствующие функциям: https://www.w3schools.com/xml/xsl_functions.asp#string.

Не следует путать с XPath Javascript :)

У меня есть намек для вас. Скажем, у вас есть узел:

<a href="http://google.com" style="padding: 10px; float: left; margin: 10px auto;">Look at me!</a> 

Используйте fn:substring-after("padding: 10px; float: left;", "float:"), чтобы получить " left; margin: 10px auto;".

И затем используйте fn:substring-before(" left; margin: 10px auto;", ";"), чтобы получить " left".

После этого используйте fn:normalize-space(" left") получить "left" :)

Answer 2

http://blog.stchur.com/2006/06/21/css-computed-style/