CSS selector to match elements by start attribute name

Is there any CSS selector to match these elements? (I need this for adblocker configuration, I looked at the document of W3C selectors - no hints were found. A general solution is necessary, because the part after that data-d-gets randomized by the site ).

<div data-d-9y3x>
<div data-d-m01>
<div data-d-whatever>
+6
source share
1 answer

No, there is currently no way to select items based on the presence of an attribute whose name starts with a specific value. Starting with a selection is only possible for attribute values.

CSS Selectors Level 4 spec , , .

:

  • element[attribute-name]. , /.
  • JavaScript ( - ). .

var el = document.getElementsByTagName('div');

for (var i = 0; i < el.length; i++) {
  var attr = el[i].attributes; /* get all attributes on the element */
  for (var j = 0; j < attr.length; j++) {
    if (attr[j].name.indexOf('data-') == 0) { /* if element has an attribute whose name has data- */
      el[i].style.color = 'red';
      break;
    }
  }
}
<div data-d-9y3x>Some</div>
<div data-d-m01>text</div>
<div data-d-whatever>content</div>
<div test-data-d-whatever>and</div>
<div d-whatever>more</div>
<div testdata-d-whatever>...</div>
+2

Source: https://habr.com/ru/post/1617878/


All Articles