Changement de la hauteur/largeur de l'objet SVG à l'aide de JavaScript

Je veux changer la hauteur ou la largeur lors d'un clic sur un bouton. J'ai essayer ceci mais ne fonctionne pas:

function modify(){
    document.getElementById('cercle1').style.height = "10px";
    document.getElementById('cercle1').style.width = "10px";        
}
Ce qui ne fonctionne pas?
c'est un svg <rect id="cercle1" x="0" y="0" width="50" height="50" stroke-width="1" stroke="#0E0E0E" style="fill:rouge; contour:noir; largeur du trait:2"; />

OriginalL'auteur akm | 2014-10-15

  1. 36

    En SVG largeur et la hauteur de <rect> éléments sont des attributs et non pas des propriétés CSS de sorte que vous auriez besoin d'écrire

    document.getElementById('cercle1').setAttribute("height", "10px");

    de même pour la largeur.

    Merci, ça m'a aidé. Je tiens à ajouter, toutefois, qu'il doit être "10", pas "10px", puisque nous sommes à la définition de la valeur de l'élément de l'attribut, et non pas une propriété css. Ou je me trompe?
    10px est le même que 10 pour une longueur de l'attribut. Est valide, alors oui, vous vous trompez.

    OriginalL'auteur Robert Longson