d3js/jQuery选择器不工作

所以我有这个SVG，我想选择具有某个特定值的所有路径。具体来说，属性键是“NEN2580”，值可以是许多事物。d3js/jQuery选择器不工作

因此，可以说，我们有一组类似的路径：

<path style="stroke: rgb(0, 0, 0); fill: rgb(255, 255, 255); color: black; stroke-width: 0.25px; background-color: white;" d="M486.623,219.237 L486.375,217.624 L454.744,222.999 L454.972,224.497 L455.785,230.259 L456.344,235.117 L456.471,236.294 L457.993,236.122 L458.354,235.678 L459.039,236.234 L457.298,238.38 L462.863,242.894 L469.513,242.52 L469.228,237.441 L465.083,237.079 L465.16,236.2 L470.067,236.629 L470.395,242.471 L489.055,241.423 L488.64,236.886 L488.513,235.176 L488.369,233.611 L487.935,228.895 L487.716,226.954 L487.502,225.366 L486.623,219.237" guid="3e_Z0UB95FzQ84RHxlySDx" _id="3e_Z0UB95FzQ84RHxlySDx" type="IfcSpace" name="Cel" number="A1.01" ruimtefunctie="" toegankelijkheid="false" area="11.58914065878" NEN2580="Nuttige ruimte" ancestors="1EbDErTW54e9tQrrOBatzH,1EbDErTW54e9tQrrRq52Ux,1EbDErTW54e9tQrrRq52Uu,1EbDErTW54e9tQrrRq52Uw"></path>

我有这个代码，我肯定会工作，但不会：

d3.selectAll("path[NEN2580='Nuttige ruimte']").style({fill: 'rgb(41, 128, 185)'});

也在改变它以下不起作用：

$("path[NEN2580='Nuttige ruimte']").css("fill", "rgb(41, 128, 185)");

是否不可能选择以数字结尾的键？只有我可以想出来，但我无法在以数字结尾的属性键的css选择器文档中找到任何约束。

在此先感谢

来源

2015-01-26 Wouter Coebergh

你使用NEN2580属性不是有效的SVG属性。为了使其有效，您可以定义一个自定义XML名称空间并在您的<svg>标记中引用该名称空间。（您示例中的其他属性具有相同的问题。）因为它无效，所以浏览器不解析它，所以JavaScript无法基于它进行选择。

来源

2015-01-26 23:02:17

浏览器解析所有的属性。 – 2015-01-27 01:09:47

他们解析所有的HTML属性（否则Angular永远不会飞）而不是SVG。例如，将'NEN2580'改为'id'，OP的代码工作正常。（我用jsfiddle验证过，但没有保存。） – 2015-01-27 01:18:46

id是小写NEN2580不是。 – 2015-01-27 01:29:33

假设你在HTML这样做（而不是XML）的属性必须是lower case in the selector（HTML不区分大小写）

$("path[nen2580='Nuttige ruimte']").css("fill", "rgb(41, 128, 185)");

来源

2015-01-27 01:09:13

无效：S感谢您的想法 – 2015-01-27 12:32:59

适用于Firefox 。你在答案中尝试了jsfiddle吗？ – 2015-01-27 13:46:09

由于SVG的属性被动态地从一个NoSQL数据库生成，这是通过另一个服务填充，属性的名称是在capitols，NEN2580。我改变了数据库以小写形式写入属性，就像nen2580一样，这就实现了。

奇怪的是，当它在capitols中时，查询小写字体不起作用，但是当它属于小写字母时，查询capitols似乎并不重要。

所以：

什么不工作：

SVG：

<path NEN2580="Nuttige ruimte">

JS：

$("path[NEN2580='Nuttige ruimte']").css("fill", "rgb(1,1,1)") 
$("path[nen2580='Nuttige ruimte']").css("fill", "rgb(1,1,1)")

什么工作：

SVG：

<path nen2580="Nuttige ruimte">

JS：

$("path[NEN2580='Nuttige ruimte']").css("fill", "rgb(1,1,1)") 
$("path[nen2580='Nuttige ruimte']").css("fill", "rgb(1,1,1)")

来源

2015-01-27 12:46:05

d3js/jQuery选择器不工作

回答

相关问题