.getPropertyValue()

Getting a string with the CSS property of the element.

Time to read: less than 5 min

Briefly

The method getPropertyValue() returns a string that contains the value of the specified CSS property. If the property is not specified, it returns an empty string.

How to write

        
          
          element.getPropertyValue('value')
          element.getPropertyValue('value')

        
        
          
        
      

Example

Let's create a block element sized 100 by 200 pixels.

        
          
          <div class="block"></div>
          <div class="block"></div>

        
        
          
        
      
        
          
          .block {  background-color: aqua;  width: 100px;  height: 200px;}
          .block {
  background-color: aqua;
  width: 100px;
  height: 200px;
}

        
        
          
        
      

We'll record the width of the element in a variable and display it on the screen:

        
          
          const block = document.querySelector('.block')// Getting all styles of the elementconst styles = window.getComputedStyle(block)const width = styles.getPropertyValue('width')console.log(width)// 100px
          const block = document.querySelector('.block')
// Getting all styles of the element
const styles = window.getComputedStyle(block)
const width = styles.getPropertyValue('width')

console.log(width)
// 100px