Skip to content
Related Articles

Related Articles

HTML | DOM ol compact Property
  • Last Updated : 28 Oct, 2020

The HTML DOM ol compact Property is used to set or return a value of the compact attribute in <ol> tag. The compact attribute is used to define the list that should be smaller than the normal by reducing the space between the list items and the indentation of the list. It is a Boolean attribute.

Syntax: 

  • It returns ol compact Property.
olObject.compact
  • It is used to set the ol compact property.
olObject.compact = "True/false";

Property Values:

  • true: It defines that the compact property is set.
  • false: It defines that the compact property is not set.

Return Values: It returns a string value that represents the compact property is set to true or false.
Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html> 
<html
  
<head
    <title>HTML DOM ol compact Property</title
</head
  
<body
    <h1>GeeksforGeeks</h1
    <h2> HTML DOM ol compact Property </h2
    <ol id="Geeks" type="1" compact> 
  
        <!-- Assigning id to 'li tag' -->
        <li id="GFG">Geeks</li
        <li>Sudo</li
        <li>Gfg</li
        <li>Gate</li
        <li>Placement</li
    </ol
    <button onclick="myGeeks()">Submit</button
    <p id="sudo"></p
    <script
        function myGeeks() { 
            // Accessing 'ol' tag. 
            var g = document.getElementById( 
            "Geeks").compact; 
            document.getElementById( 
            "sudo").innerHTML = g; 
        
    </script
</body
  
</html

chevron_right


Output:
Before Clicking On Button:



After Clicking On Button:

Example 2:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html> 
<html
  
<head
    <title>HTML DOM ol compact Property</title
</head
  
<body
    <h1>GeeksforGeeks</h1
    <h2> HTML DOM ol compact Property </h2
    <ol id="Geeks" type="1" compact> 
  
        <!-- Assigning id to 'li tag' -->
        <li id="GFG">Geeks</li
        <li>Sudo</li
        <li>Gfg</li
        <li>Gate</li
        <li>Placement</li
    </ol
    <button onclick="myGeeks()">Submit</button
    <p id="sudo"></p
    <script
        function myGeeks() { 
            // Accessing 'ol' tag. 
            var g = document.getElementById( 
            "Geeks").compact = "false"; 
            document.getElementById( 
            "sudo").innerHTML = g; 
        
    </script
</body
  
</html

chevron_right


Output:
Before Clicking On Button: 

After Clicking On Button: 

full-stack-img

My Personal Notes arrow_drop_up
Recommended Articles
Page :