HTML | DOM Ol type Property
The DOM Ol type Property is used to set or return the type attribute in an ordered list. This attribute defines which type(1, A, a, I and i) of order you want in your list numeric, alphabetic or roman numbers.
Syntax:
- It is used to return the type property.
olObject.type
- It is used to set the type property.
olObject.type = "1|a|A|i|I"
Property Values:
- 1: This is the default value. It defines the list items in decimal number.(1, 2, 3, 4 .).
- a: It defines the list items in alphabetically ordered lowercase letters .(a, b, c, d …)
- A: It defines the list items in alphabetically ordered uppercase letters.(A, B, C, D ..)
- i: It defines the list items in lowercase roman number order.(i, ii, iii, iv, v, vi …)
- I: It defines the list items in uppercase roman number order.(I, II, III, IV, V, VI ..)
Return Value: It returns a string value which represents the kind of marker used in the ordered list.
Example-1: HTML Program that illustrate how to set the type Property.
html
<!DOCTYPE html> < html > < head > < title >dom ol type Property</ title > </ head > < body > < h1 style = "color:green;" >w3wiki</ h1 > < h2 style = "color:green;" >DOM ol type Property</ h2 > < p >List of all computer Subjects are</ p > < ol id = "GFG" > < li >Data Structures</ li > < li >Operating System</ li > < li >Python programming</ li > < li >DBMS</ LI > < li >Computer Network</ li > </ ol > < button onclick = "myBeginner()" >Submit</ button > <!-- Script to set the type of list --> < script > function myBeginner() { var x = document.getElementById("GFG").type = "a"; } </ script > </ body > </ html > |
Output:
Before clicking on the button :
After clicking on the button :
Example-2 : HTML Program that illustrate how to return the type Property.
html
<!DOCTYPE html> < html > < head > < title >Dom ol type Property</ title > </ head > < body > < h1 style = "color:green;" >w3wiki</ h1 > < h2 style = "color:green;" >DOM ol type Property</ h2 > < p >List of all computer Subjects are</ p > < ol id = "GFG" type = "I" > < li >Data Structures</ li > < li >Operating System</ li > < li >python programming</ li > < li >DBMS</ li > < li >Computer Network</ li > </ ol > < button onclick = "myBeginner()" >Submit</ button > < p id = "sudo" style = "font-size:25px;color:green;" ></ p > <!-- Script to get the type of list --> < script > function myBeginner() { var x = document.getElementById("GFG").type; document.getElementById("sudo").innerHTML = "The type of Ordered list:" + x; } </ script > </ body > </ html > |
Output:
Before clicking on the button:
After clicking on the button:
Supported Browsers: The browser supported by DOM ol type Property are listed below:
- Google Chrome
- Internet Explorer
- Firefox
- Opera
- Safari