Question

我有一个小功能，我需要找到动态添加的圆的半径和中心。

function CalculateEdgeData(nodeId1,nodeId2)
        {
          console.log(nodeId1);
          var node1cx =  $( "circle[nodeId="+nodeId1+"]" ).attr('cx');
          console.log(node1cx);
        }

但是$( "circle[nodeId="+nodeId1+"]" )返回null。是否可以使用jquery以这种方式选择svg元素？

dom结构如下（通过d3js动态添加，但在浏览器中呈现如下）。

<circle cx="150" cy="100" r="40" nodeId="1" class="head" style="fill: none; stroke: rgb(204, 204, 204);"></circle>

当我在控制台$(circle)中尝试返回所有圈子的数组时，nodeId1也具有所需的值。我做错了什么？

Answer 1

尝试在value选择器

处的[name='value']附近放置引号

function CalculateEdgeData(nodeId1, nodeId2) {
  console.log(nodeId1);
  // added single quotes `'` before, after double quotes at `'" + nodeId1 + "'`
  var node1cx = $("circle[nodeId='" + nodeId1 + "']").attr('cx');
  console.log(node1cx);
}

CalculateEdgeData("1")

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<svg viewBox="0 0 120 120" version="1.1" xmlns="http://www.w3.org/2000/svg">
  <circle cx="150" cy="100" r="40" nodeId="1" class="head" style="fill: none; stroke: rgb(204, 204, 204);" />
  <circle cx="60" cy="60" r="50" />
</svg>

使用Jquery按特定属性值选择SVG元素

1 个答案: