jQuery

Image result for jquery


What is ?


jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility, jQuery has changed the way that millions of people write JavaScript.

Including jQuery

Below are some of the most common ways to include jQuery.

Browser

Script tag


<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>

ref in -npm

Using jQuery


  •      At its core, jQuery is used to connect with HTML elements in the browser via the DOM.
  • The DOM is the method by which JavaScript (and jQuery) interact with the HTML in a browser. To view exactly what the DOM is, in your web browser, right click on the current web page select Inspect. This will open up Developer Tools. The HTML code you see here is the DOM.
  • Each HTML element is considered a node in the DOM - an object that JavaScript can touch. These objects are arranged in a tree structure, with <html> being closer to the root, and each nested element being a branch further along the tree. JavaScript can add, remove, and change any of these elements.
  • If you right click on the site again and click View Page Source, you will see the raw HTML output of the website. It’s easy at first to confuse the DOM with the HTML source, but they’re different - the page source is exactly what is written in the HTML file. It is static and will not change, and will not be affected by JavaScript. The DOM is dynamic, and can change.
  • The outermost layer of the DOM, the layer that wraps the entire <html> node, is the document object. To begin manipulating the page with jQuery, we need to ensure the document is “ready” first.

Comments

Post a Comment

Popular posts from this blog

Pseudocode

It's a informal high level description of the operating principle of a computer programs  or other algorithms. It  just pre planted to write programs.  We use some element suchas Start, input, if,while... It develops our problems solving skill. It is most important for developer how to write pseudocode? start with the alcoritham you are using,and pharse it using word that are easily transcribed into computer instruction indent when you are enclosing instruction within aloop or a conditional clause avoid word associated with acertain kind computer language.
Read more

Bootstrap

Image
BOOTSTRAP   Bootsrap is framework of css.there are many frame to css.UIkit, Semantic UI, Bulma ,Tailwind etc. It is very easy to use.   If you’re not familiar with how a framework like Bootstrap works, a few code examples will help, so you can see how easy it is to build maintainable interfaces by editing nothing but HTML.   Bootstrap includes HTML and CSS based design templates for typography, forms, buttons, tables, navigation, modals, image carousels and many other, as well as optional JavaScript plugins   Bootstrap also gives you the ability to easily create responsive designs same bootstrap class are    forms :-.text-muted, .text-primary, .text-success, .text-info, .text-warning, .text-danger, .text-secondary, .text-white, .text-dark, .text-body (default body color/often black) and .text-light   buttons :-.btn   tables :-table   navigation:-nav   image:-.img-thumbnail,.rounded-circle
Read more

Mongodb

Image
Basic commands on mongo shell  Show all available databases:  show dbs;  Select a particular database to access, e.g. mydb. This will create mydb if it does not already exist:   use mydb;  Show all collections in the database (be sure to select one first, see above):  show collections;  Show all functions that can be used with the database:  db.my db.help();  To check your currently selected database,use the command db  > db  mydb db.dropDatabase() command is us ed to drop a existing database.  db.dropDatabase() insert collection  We add tworecords to our collection test as: >db.test.insert({"key":"value1","key2":"Val2","key3":"val3"})  WriteResult({ "nInserted" : 1 }) > db.test.insert({"key":"value2","key2":"Val21","key3":"val31"})  WriteResult({ "nInserted" : 1 })  If we see them via find, they will look very...
Read more