This site is mobile accessible. Press the "Tap Here" button to use a different font-size.


Smartphone icons created by Freepik - Flaticon

  • 19.1 jQuery Selectors
  • 19.2 jQuery HTML
  • 19.3 jQuery CSS
  • 19.4 jQuery DOM
    •
  • 1.1 JS Introduction
  • 1.2 JS Where To Install
  • 1.3 JS Output
  • 1.4 JS Statements
  • 1.5 JS Syntax
  • 1.6 JS Comments
    •
  • 2.1 JS Variables
  • 2.2 JS Let
  • 2.3 JS Const
  • 2.4 JS Operators
  • 2.5 JS Arithmetic
  • 2.6 JS Assignment
    •
  • 3.1 JS Data Types
  • 3.2 JS Functions
  • 3.3 JS Objects
  • 3.4 JS Events
    •
  • 4.1 JS Strings
  • 4.1.1 JS String Methods
  • 4.1.2 JS String Search
  • 4.1.3 JS String Templates
  • 4.2 JS Numbers
  • 4.2.1 JS BigInt
  • 4.2.2 JS Number Methods
  • 4.2.3 JS Number Properties
  • 4.3 JS Arrays
  • 4.3.1 JS Array Methods
  • 4.3.2 JS Array Sort
  • 4.3.3 JS Array Iteration
  • 4.3.4 JS Array Const
    •
  • 5.1 JS Dates
  • 5.1.1 JS Date Formats
  • 5.1.2 JS Get Date Methods
  • 5.1.3 JS Set Date Methods
  • 5.2 JS Math
  • 5.3 JS Random
    •
  • 6.1 JS Booleans
  • 6.2 JS Comparisons
  • 6.3 JS Conditions
  • 6.4 JS Switch
  • 6.5 JS For Loops
  • 6.6 JS While Loops
  • 6.7 JS Break Loops
    •
  • 7.1 JS Sets
  • 7.2 JS Maps
  • 7.3 JS Typeof
  • 7.4 JS Type Conversion
  • 7.5 JS Bitwise
  • 7.6 JS RegExp
  • 7.7 JS Precedence
  • 7.8 JS Errors
  • 7.9 JS Scope
  • 7.10 JS Hoisting
  • 7.11 JS Strict Mode
  • 7.12 JS this Keyword
  • 7.13 JS Arrow Function
    •
  • 8.1 JS Classes
  • 8.2 JS Modules
  • 8.3 JS JSON
  • 8.4 JS Debugging
  • 8.5 JS Style Guide
  • 8.6 JS Best Practices
  • 8.7 JS Mistakes
  • 8.8 JS Performance
  • 8.9 JS Reserved Words
    •
  • 9.1 JS Versions
  • 9.2 JS 2009 (ES5)
  • 9.3 JS 2015 (ES6)
  • 9.4 JS 2016
  • 9.5 JS 2017
  • 9.6 JS 2018
  • 9.7 JS 2019
  • 9.8 JS 2020
  • 9.9 JS 2021/2022
  • 9.10 JS IE / Edge
  • 9.11 JS Versions History
    •
  • 10.1 JS Object Definitions
  • 10.2 JS Object Properties
  • 10.3 JS Object Methods
  • 10.4 JS Object Display
  • 10.5 JS Object Accessors
  • 10.6 JS Object Constructors
  • 10.7 JS Object Prototypes
  • 10.8 JS Object Iterables
  • 10.9 JS Object Sets
  • 10.10 JS Object Maps
  • 10.11 JS Object Reference
    •
  • 11.1 JS Function Definitions
  • 11.2 JS Function Parameters
  • 11.3 JS Function Invocation
  • 11.4 JS Function Call
  • 11.5 JS Function Apply
  • 11.6 JS Function Bind
  • 11.7 JS Function Closures
    •
  • 12.1 JS Class Intro
  • 12.2 JS Class Inheritance
  • 12.3 JS Class Static
    •
  • 13.1 JS Callbacks
  • 13.2 JS Asynchronous
  • 13.3 JS Promises
  • 13.4 JS Async/Await
    •
  • 14.1 DOM Intro
  • 14.2 DOM Methods
  • 14.3 DOM Document
  • 14.4 DOM Elements
  • 14.5 DOM HTML
  • 14.6 DOM Forms
  • 14.7 DOM CSS
  • 14.8 DOM Animations
  • 14.9 DOM Events
  • 14.10 DOM Event Listener
  • 14.11 DOM Navigation
  • 14.12 DOM Nodes
  • 14.13 DOM Collections
  • 14.14 DOM Node Lists
    •
  • 15.1 JS Window
  • 15.2 JS Screen
  • 15.3 JS Location
  • 15.4 JS History
  • 15.5 JS Navigator
  • 15.6 JS Popup Alert
  • 15.7 JS Timing
  • 15.8 JS Cookies
    •
  • 16.1 Web API Intro
  • 16.2 Web Forms API
  • 16.3 Web History API
  • 16.4 Web Storage API
  • 16.5 Web Worker API
  • 16.6 Web Fetch API
  • 16.7 Web Geolocation API
    •
  • 17.1 AJAX Intro
  • 17.2 AJAX XMLHttp
  • 17.3 AJAX Request
  • 17.4 AJAX Response
  • 17.5 AJAX XML File
  • 17.6 AJAX PHP
  • 17-6AJAXPHP.php
  • 17.8 AJAX Database
  • 17.9 AJAX Applications
    •
  • 18.1 JSON Intro
  • 18.2 JSON Syntax
  • 18.3 JSON vs XML
  • 18.4 JSON Data Types
  • 18.5 JSON Parse
  • 18.6 JSON Stringify
  • 18.7 JSON Objects
  • 18.8 JSON Arrays
  • 18.9 JSON Server
  • 18.10 JSON PHP
  • 18.11 JSON HTML
  • 18.12 JSON JSONP
    •
  • 19.1 jQuery Selectors
  • 19.2 jQuery HTML
  • 19.3 jQuery CSS
  • 19.4 jQuery DOM
    •

    • 19.3 jQuery CSS

    • jQuery was created in 2006 by John Resig. It was designed to handle Browser Incompatibilities and to simplify HTML DOM Manipulation, Event Handling, Animations, and Ajax.
    • For more than 10 years, jQuery has been the most popular JavaScript library in the world.
    • However, after JavaScript Version 5 (2009), most of the jQuery utilities can be solved with a few lines of standard JavaScript:

    Hiding HTML Elements

    Hide an HTML Element:

    jQuery

    myElement.hide();

    Try it yourself

    JavaScript

    myElement.style.display = "none";

    Try it yourself

    Showing HTML Elements

    Show an HTML Element:

    jQuery

    myElement.show();

    Try it yourself

    JavaScript

    myElement.style.display = "";

    Try it yourself

    Styling HTML Elements

    Change the font size of an HTML element:

    jQuery

    $("#demo").css("font-size","35px");

    Try it yourself

    JavaScript

    document.getElementById("demo").style.fontSize = "35px";

    Try it yourself

    JavaScript Fundamentals course home
    Module 19 jQuery

    Navigate this module

    Eventually the navigation links, above, will be replaced by these << (previous) and >> (next) buttons below.



    JavaScript icons used in the buttons provided by ICONS8.COM. Smartphone icons created by Freepik - Flaticon

    Example files created in this module: