javascript - D3 how to select element by ID when there is a dot in ID - Stack Overflow

admin管理员组

文章数量:1345291

I have

<text id="element.id.with.dots" x="10" xml:space="preserve" y="10" stroke="none">

How can I select it using d3.select? This doesn't seem to work, it returns null

var textElem = d3.select("text[id=element\\.id\\.with\\.dots]");

and this :

var textElem = d3.select("text[id=element.id.with.dots]");

gives me error in Firebug console window:

SyntaxError: An invalid or illegal string was specified

I have

<text id="element.id.with.dots" x="10" xml:space="preserve" y="10" stroke="none">

How can I select it using d3.select? This doesn't seem to work, it returns null

var textElem = d3.select("text[id=element\\.id\\.with\\.dots]");

and this :

var textElem = d3.select("text[id=element.id.with.dots]");

gives me error in Firebug console window:

SyntaxError: An invalid or illegal string was specified

• javascript
• select
• d3.js

Share Improve this question Follow edited Nov 3, 2015 at 15:21 Benas asked Nov 3, 2015 at 15:14 BenasBenas 2,33222 gold badges4545 silver badges6868 bronze badges 1

• 3 This may help you: stackoverflow./questions/70579/… – Finrod Commented Nov 3, 2015 at 15:24

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 12

Use a quoted string to delimit the value of your attribute:

var textElem = d3.select("text[id='element.id.with.dots']");

var el = d3.select("text[id='element.id.with.dots']");
el.style({fill: 'red'})

<script src="https://cdnjs.cloudflare./ajax/libs/d3/3.4.11/d3.min.js"></script>
<svg>
     <text id="element.id.with.dots" x="10" xml:space="preserve" y="10" stroke="none">Text/<text>
</svg>

Another solution would be to escape each period by putting a backslash \ before it—then you can use d3.select() or d3.selectAll() as usual.

You can use .replace(/\./g, '\\.') to add the backslashes automatically.

Remember (thanks, altocumulus!), to escape the backslashes themselves with another backslash if you're editing the id manually.

d3.select("#element\\.id\\.with\\.dots")

本文标签： javascriptD3 how to select element by ID when there is a dot in IDStack Overflow