Open In App

SVG UseElement.width Property

Improve
Improve
Like Article
Like
Save
Share
Report

The SVG UseElement.width property Returns an SVGAnimatedLength object corresponding to the attribute of the given use element.

Syntax:

UseElement.width

Return value: This property returns SVGAnimatedLength object that can be used get the width the use element.

Example 1: 

HTML




<!DOCTYPE html> 
<html
  
<body>
  <svg width="800" height="800"
        xmlns="http://www.w3.org/2000/svg">        
        <rect id="gfg" 
                x="100" 
                y="100" 
                height="150"
                width="150"
                fill="green"/> 
            
        <use href="#gfg" x="200" y="200" 
            height="150" width="150" id="useid">
        </use
  
        <script type="text/javascript">
          var u = document.getElementById("useid");
          console.log(u.width);
          console.log(u.width.animVal.value)
        </script>
    </svg
</body>
  
</html>


Output:

Example 2: 

HTML




<!DOCTYPE html> 
<html
  
<body>
  <svg width="800" height="800"
        xmlns="http://www.w3.org/2000/svg">        
        <image href=
            height="200" width="200" id="gfg"/>
            
        <use href="#gfg" x=0 y=300 height="200" 
             width="200" id="useid"></use
        <script type="text/javascript">
          var u = document.getElementById("useid");
          console.log(u.width);
          console.log(u.width.baseVal.value);
        </script>
    </svg
</body>
  
</html>


Output:



Last Updated : 30 Mar, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads