1. Home
  2. /
  3. Jquery
  4. /
  5. Simple Counter

Simple Counter - Jquery Typing CST Test

Loading…

Simple Counter — Jquery Code

Basic counter with increment, decrement, reset, and theme toggle.

$(document).ready(function() {
	var count = 0;
	var isDark = false;

	function updateCounter() {
		$('#counter').text(count);
		$('#container').toggleClass('dark-theme', isDark);
		$('#container').toggleClass('light-theme', !isDark);
		$('#theme-btn').text('Switch to ' + (isDark ? 'Light' : 'Dark') + ' Theme');
	}

	$('#increment').click(function() { count++; updateCounter(); });
	$('#decrement').click(function() { count--; updateCounter(); });
	$('#reset').click(function() { count = 0; updateCounter(); });
	$('#theme-btn').click(function() { isDark = !isDark; updateCounter(); });

	updateCounter();
});

Jquery Language Guide

jQuery is a fast, small, and feature-rich JavaScript library designed to simplify DOM manipulation, event handling, animations, and AJAX interactions. It provides a unified API that works consistently across all major browsers.

Primary Use Cases

  • ▸Legacy websites and enterprise systems
  • ▸WordPress plugins and themes
  • ▸Quick DOM scripting and UI enhancements
  • ▸Form validation and AJAX requests
  • ▸Projects needing wide browser compatibility

Notable Features

  • ▸CSS-like DOM selectors
  • ▸Chainable APIs
  • ▸Animation utilities
  • ▸AJAX helpers
  • ▸Large plugin ecosystem

Origin & Creator

Created by John Resig in 2006 to provide a concise, cross-browser JavaScript API at a time when native browser features were inconsistent and limited.

Industrial Note

jQuery remains critical for legacy enterprise apps, WordPress themes/plugins, quick UI scripts, and environments where modern frameworks are overkill or unsupported.

More Jquery Typing Exercises

jQuery Counter with StepjQuery Counter with Min/MaxjQuery Counter with Auto IncrementjQuery Counter with Double IncrementjQuery Counter with Even/Odd IndicatorjQuery Counter with Max/Min and StepjQuery Counter with LocalStoragejQuery Counter with Color Themes

Practice Other Languages

CReactPythonC++RustTypeScriptKotlinPHPJavaC#RubyMqlCqlN1qlCypher