Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
94 views

Learn JQuery - Learn JQuery - Introduction Cheatsheet - Codecademy

jQuery is a JavaScript library that simplifies dynamic behavior on web pages by providing predefined methods for selecting and manipulating DOM elements. It allows behaviors to be assigned to DOM elements using fewer lines of code than traditional JavaScript. jQuery's .ready() method ensures code only runs after the DOM is fully loaded to prevent unexpected issues. jQuery objects are typically stored in variables beginning with "$" for easy identification. jQuery is usually imported from a CDN and added before the closing </body> tag so it loads before any other JavaScript files using jQuery.

Uploaded by

ilias ahmed
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
94 views

Learn JQuery - Learn JQuery - Introduction Cheatsheet - Codecademy

jQuery is a JavaScript library that simplifies dynamic behavior on web pages by providing predefined methods for selecting and manipulating DOM elements. It allows behaviors to be assigned to DOM elements using fewer lines of code than traditional JavaScript. jQuery's .ready() method ensures code only runs after the DOM is fully loaded to prevent unexpected issues. jQuery objects are typically stored in variables beginning with "$" for easy identification. jQuery is usually imported from a CDN and added before the closing </body> tag so it loads before any other JavaScript files using jQuery.

Uploaded by

ilias ahmed
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

Cheatsheets / Learn jQuery

Learn jQuery: Introduction


jQuery streamlines dynamic behavior
jQuery is a JavaScript library that streamlines the creation
of dynamic behavior with predefined methods for //Selecting DOM elements and adding an
selecting and manipulating DOM elements. It offers a event listener in JS
simplified approach to implementing responsiveness and const menu
requires fewer lines of code to assign behaviors to DOM = document.getElementById('menu');
elements than traditional JavaScript methods.
const closeMenuButton
= document.getElementById('close-menu-
button');
closeMenuButton.addEventListener('click',
() => {
    menu.style.display = 'none';
});

//Selecting DOM elements and adding an


event listener in jQuery
$('#close-menu-button').on('click', () =>{
  $('#menu').hide();  
});

jQuery document ready


JavaScript code runs as soon as its file is loaded into the
browser. If this happens before the DOM (Document $(document).ready(function() {
Object Model) is fully loaded, unexpected issues or   // This code only runs after the DOM is
unpredictable behaviors can result. loaded.
jQuery’s .ready() method waits until the DOM is fully
  alert('DOM fully loaded!');
rendered, at which point it invokes the specified callback
});
function.

jquery object variables start with


jQuery objects are typically stored in variables where the
variable name begins with a $ symbol. This naming //A variable representing a jQuery object
convention makes it easier to identify which variables are const $myButton = $('#my-button');
jQuery objects as opposed to other JavaScript objects or
values.
jQuery CDN Import
jQuery is typically imported from a CDN (Content Delivery
Network) and added at the bottom of an HTML document <html>
in a <script> tag before the closing </body> tag.   <head></head>
The jQuery <script> tag must be listed before linking to   <body>
any other JavaScript file that uses the jQuery library.
    <!-- HTML code -->
    
    <!--The jQuery library-->
    <script
src="https://code.jquery.com/jquery-
3.3.1.min.js"></script>

    <!--Site-specific JavaScript code


using jQuery-->
    <script src="script.js"></script>
  </body>
</html>

You might also like