Die Breite von <rect element von <svg

Question

kann nicht abgerufen werden. Ich versuche, auf die letzte "rect" zuzugreifen, so dass ich ihre Breite und Höhe erhalten kann. Ich habe versucht, folgende Jquery $(".highcharts-plot-background").width() aber alles, was ich in der Antwort erhalten ist 0. Auch versucht $(".highcharts-plot-background")[0].width() zu verwenden, aber dann bekomme ich folgende Fehlermeldung

Uncaught TypeError: $(...).width() is not a function.

Ich bin offen für Vorschläge.

<svg version="1.1" class="highcharts-root" xmlns="http://www.w3.org/2000/svg" width="710" viewBox="0 0 710 325" height="325"> 
 
    <desc>Created with Highcharts 5.0.0</desc> 
 
    <defs> 
 
    <clipPath id="highcharts-1"> 
 
     <rect x="0" y="0" width="636" height="238" fill="none"></rect> </clipPath> 
 
    </defs> 
 
    <rect fill="#ffffff" class="highcharts-background" x="0" y="0" width="710" height="325" rx="0" ry="0"></rect> 
 
    <rect fill="none" class="highcharts-plot-background" x="64" y="50" width="636" height="238" style="margin:0px;"></rect> 
 
</svg>

Answer 1

Verwenden attr("width") statt width(). Wenn Sie die Breite in der CSS deklariert hätten, dann würde width() gut funktionieren.

Siehe das folgende Schnipsel.

console.log($(".highcharts-plot-background").attr("width"));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<svg version="1.1" class="highcharts-root" xmlns="http://www.w3.org/2000/svg" width="710" viewBox="0 0 710 325" height="325"> 
 
    <desc>Created with Highcharts 5.0.0</desc> 
 
    <defs> 
 
    <clipPath id="highcharts-1"> 
 
     <rect x="0" y="0" width="636" height="238" fill="none"></rect> </clipPath> 
 
    </defs> 
 
    <rect fill="#ffffff" class="highcharts-background" x="0" y="0" width="710" height="325" rx="0" ry="0"></rect> 
 
    <rect fill="none" class="highcharts-plot-background" x="64" y="50" width="636" height="238" style="margin:0px;"></rect> 
 
</svg>