JQuery Advantages
◦ Small size (v1.2.3 15kb)
◦ Rich DOM selector (CSS1-3 XPath) ◦ Cross-browser (IE6, FF, Safari, Opera)
◦ Chain Style code
◦ Powerful event and style support
◦ Powerful AJAX function
◦ Easy to extend, rich plug-ins
jQuery’s constructor receives four types of parameters:
jQuery(expression, context)
jQuery(html)
jQuery(elements)
jQuery(fn)
The first method is to find the document based on expression (ID, DOM element name, CSS expression, XPath expression) elements and assembled into a jQuery object returned.
DEMO:
If you need to introduce external Js, you need to refresh to execute
]
Add the following jQuery code to the end of the article In the script block:
jQuery("ul>li:first").addClass("selected");
The page running effect is as follows:
where jQuery() can be replaced by Shortcut $(), if $ is occupied by other objects, you can use the jQuery.noConflict() function to cancel the shortcut.
"ul>li:first" where ul>li represents all li elements located under ul (which are CSS expressions, XPath mode can use ul/li), and :first represents the first one among them. addClass() is a function used by jQuery objects to add CSS style classes, and the opposite function is removeClass().
Add the following code:
$('ul').append($('
new item'));
The operation effect is as follows:
Where $('
new item') converts the string into a DOM object, and then adds it to the end of the ul object through the append() function.
Next:
$(document).ready(function(){
$('ul').css('color','red');
});
The effect is as follows:
The jQuery constructor can also directly pass in DOM objects, such as document, or jQuery objects (of course it is meaningless). The ready() function adds an event handling function to the document and sets the color of ul to red.
$(document).ready() has many application scenarios, so it can be directly replaced by $(fn), where fn represents the processing function. (The ready processing function seems to be executed after the document content is loaded. There is no need to wait for related resources such as other images to be loaded, so it is executed earlier than the load event. There is no specific confirmation on this)
$(function() {
alert('welcome to jQuery');
});
The effect of the above code is that as soon as the page is loaded, a dialog box will pop up.
reference:http://docs.jquery.com/Core
http://docs.jquery.com/Selectors