css3-modsel-d3.xml (1240B)
1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head> 3 <title>Dynamic handling of attribute selectors</title> 4 <style type="text/css"><![CDATA[ 5 [test] { background: red; display: block; padding: 1em; } 6 stub ~ [|attribute^=start]:not([|attribute~=mid])[|attribute*=dle][|attribute$=end] ~ t { background: lime; } 7 ]]></style> 8 <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch"/> 9 <link rel="help" href="https://www.w3.org/TR/css3-selectors/#selectors"/> <!-- bogus link to make sure it gets found --> 10 <meta name="flags" content=" dom namespace" /> 11 </head> 12 <body> 13 14 <div> 15 16 <script type="text/javascript"> 17 <![CDATA[ 18 19 function test() { 20 document.getElementsByTagNameNS('', 't')[1].setAttributeNS('', 'attribute', 'start middle end'); 21 } 22 23 window.setTimeout("test()", 100); 24 ]]> 25 </script> 26 27 <p> The following block should be green. </p> 28 29 <!-- root of selector --> 30 <stub xmlns=""></stub> 31 32 <!-- middle part of selector does not match this --> 33 <t xmlns="" attribute="fake"></t> 34 35 <!-- middle part of selector matches this once attribute is fixed --> 36 <t xmlns="" attribute="start mid dle end"></t> 37 38 <!-- subject of selector --> 39 <t xmlns="" test="test"></t> 40 41 </div> 42 43 </body> 44 </html>