ansaurus

Question

selectors-api for data attributes

Answer 1

+4 A:

The syntax for attribute selectors is [att=val] so you want "div[data-foo='bar']".

Anne 2010-04-19 05:58:28

Right -- the first one. But, that still give an error message in Chrome. Does it work in any browsers for you?

dTRN 2010-04-19 14:07:34

Answer 2

A:

Anne is right. (Fortunately, as he is one of the editors of the relevant specification.)

<!DOCTYPE html>
<style>
div[data-foo='bar'] {
  background:blue;
}
</style>
<div data-foo='bar'>colored</div>
<div>not colored</div>
<script>
var foos = document.querySelectorAll("div[data-foo='bar']");
alert(foos[0])
</script>

works for me is Firefox, Opera and Chrome. Note that it's div[data-foo='bar'], as you used in the CSS, rather than div[data-foo]='bar', as you used in the script.

Ms2ger 2010-04-19 18:14:03

Got it -- thanks!

dTRN 2010-04-19 20:12:47

ansaurus

tags:

views:

answers:

selectors-api for data attributes

related questions