Basic understanding and examples necessary for getting started with jquery (organized)_jquery

1.Juqery is an excellent framework for javascript. It is a lightweight js library that is compatible with CSS3 and various browsers (IE 6.0, FF 1.5, Safari 2.0, Opera 9.0). jQuery2.0 and subsequent versions will no longer support IE6/7/8 browsers . jQuery enables users to more easily process HTML documents and events, implement animation effects, and easily provide AJAX interaction for websites.

Another big advantage of jQuery is that its documentation is very complete and its various applications are explained in detail. There are also many mature plug-ins to choose from. jQuery can keep the code and HTML content of the user's HTML page separated. In other words, there is no need to insert a bunch of js in the HTML to call the command. You only need to define the id.

When using the jQuery2.0 framework, what I want to say through the above paragraph is that if some code cannot run in eclipse, it means that the browser kernel is too low. As long as it is under a higher version of the browser, can show the effect.

2. The jQuery library includes the following features:
·HTML element selection
·HTML element manipulation
·CSS manipulation
·HTML event function
·JavaScript special effects and animation
· HTML DOM traversal and modification
· AJAX
· Utilities
3. Both Google and Microsoft support jQuery very well.
If you don't want to host the jQuery library on your computer, you can load the CDN jQuery core files from Google or Microsoft.
Use Google's CDN

Copy the code The code is as follows:

Basic syntax:
jQuery syntax example
$(this).hide()
Demonstrate jQuery hide() function to hide the current HTML element.
$("#test").hide() //Read the id
Demonstrate the jQuery hide() function to hide the element with id="test".
$("p").hide()
Demonstrates the jQuery hide() function, hiding all

elements. //This way the tag can be read directly
$(".test").hide()
Demonstrates the jQuery hide() function to hide all elements with class="test". //Read the element node of class

Jquery has many selectors: jQuery element selector
jQuery uses CSS selectors to select HTML elements.
$("p") selects the

element.
$("p.intro") selects all

elements with class="intro".
$("p#demo") selects all

elements with id="demo".
jQuery Attribute Selector
jQuery uses XPath expressions to select elements with a given attribute.
$("[href]") selects all elements with href attribute.
$("[href='#']") selects all elements with an href value equal to "#".
$("[href!='#']") selects all elements with href value not equal to "#".
$("[href$='.jpg']") selects all elements whose href value ends with ".jpg".
jQuery CSS Selector
jQuery CSS Selector can be used to change CSS properties of HTML elements.

The following example changes the background color of all p elements to red:
Example

Copy code The code is as follows:

$("p").css("background-color","red");

jQuery event
below Here are some examples of event methods in jQuery:

Event 函数	绑定函数至
$(document).ready(function)	将函数绑定到文档的就绪事件（当文档完成加载时）
$(selector).click(function)	触发或将函数绑定到被选元素的点击事件
$(selector).dblclick(function)	触发或将函数绑定到被选元素的双击事件
$(selector).focus(function)	触发或将函数绑定到被选元素的获得焦点事件
$(selector).mouseover(function)	触发或将函数绑定到被选元素的鼠标悬停事件