Javascript Course


classList is a JavaScript property that can be used to work with CSS classes on HTML elements, useful to add, remove, replace and toggle CSS classes on an element. It contains an object list of the class attribute.
Syntax:
element.classList
- If the class attribute is not set or is empty, the element.classList.length returns 0.

classList Methods

The object contained by the classList property has these methods:

Examples with classList

1. Adds two css classes to a <div>:

var div1 = document.getElementById('div1');
div1.classList.add('cls_1', 'cls_2');

2. Removes a css class from a <div>:

var div1 = document.getElementById('div1');
div1.classList.remove('cls_2');

3. Checks if a <div> contains or not a specified css class:

var div1 = document.getElementById('div1');
if(div1.classList.contains('cls_1')) alert('.cls_1 in #div1');
else alert('.cls_1 not in #div1');

4. Replaces class 'foo' with 'bar':

var div1 = document.getElementById('div1');
div1.classList.replace('foo', 'bar');

5. If 'visible' is set removes it, otherwise add it:

var div1 = document.getElementById('div1');
div1.classList.toggle('visible');

Daily Test with Code Example

HTML
CSS
JavaScript
PHP-MySQL
Which tag can be used to create input text field in web page?
<form> <input> <div>
<input type="text" name="a_name" value="val" />
Which CSS property displays the text in a small-caps font?
display font-variant font-style
h3 {
  font-variant: small-caps;
}
What instruction displays a notice box with a message inside it, in JavaScript?
for() Date() alert()
var msg = "Visit CoursesWeb.net";
alert(msg);
Indicate the PHP code used to get the users IP.
$_SERVER["HTTP_USER_AGENT"] $_SERVER["REMOTE_ADDR"] $_GET[]
$ip = $_SERVER["REMOTE_ADDR"];
echo $ip;
classList - Working with CSS classes

Last accessed pages

  1. PHP PDO - exec (INSERT, UPDATE, DELETE) MySQL (51040)
  2. Ajax-PHP Chat Script (45949)
  3. Ajax Voting Script - Vote Up Down (7524)
  4. Get and change IFrame content through a JavaScript script created in another IFrame (12807)
  5. setTimeout and this with bind() method in JavaScript class (2551)

Popular pages this month

  1. Courses Web: PHP-MySQL JavaScript Node.js Ajax HTML CSS (762)
  2. PHP Unzipper - Extract Zip, Rar Archives (689)
  3. Create simple Website with PHP (642)
  4. SHA256 Encrypt hash in JavaScript (518)
  5. Read Excel file data in PHP - PhpExcelReader (515)