jQuery – Raphael – SVG – 基于自定义数据的选择器

我已将自定义数据属性分配给添加到Raphaelcanvas的某些圆圈，如下所示：

 marker.data('transaction', transaction); 

如何在canvas上找到具有相同事务数据值的元素？

目前我有代码：

 var found = document.querySelectorAll("[transaction='" + current_transaction +"']"); 

哪个应返回带有元素的NodeList，但它不起作用。 要将数据检索到变量中，它就像var foo = marker.data('transaction')一样简单，但显然，如果我想检索元素的NodeList，这不起作用。

因此，我希望我的选择器看起来如下，但我无法找出正确的语法：

 var found = document.querySelectorAll("data('transaction' = 1)"); 

任何帮助将非常感激

Answer 1

由于Raphael必须支持VML，因此不会像使用html5应用程序那样将数据保留在DOM中。 如果要在dom中存储数据，则必须访问html节点并在那里设置属性…

 marker.node.setAttribute('data-transaction', transaction); 

然后，您可以使用querySelectorAll查询元素。 请记住，这将在

如果你想保持较旧的IE支持，我建议编写一个迭代你的标记的函数，并在mark.data("transaction") == transaction时返回Raphael对象

Answer 2

我认为问题是jQuery无法访问SVG节点。 你必须尝试普通的Javascript。 如果您使用querySelectorAll ，问题可能是与旧浏览器的兼容性。

请看这里： http ： //dean.edwards.name/jsb/behavior/querySelectorAll.html和这里： http ： //www.w3.org/TR/selectors-api/#queryselectorall

可能的解决方案：查看Raphael-Doc： http ： //raphaeljs.com/reference.html#Element.data