Overview
With the rapid development of WEB2.0 and Ajax ideas on the Internet, there have been some excellent JS frameworks, among which the famous prototype, YUI, JQuery, MooTools, Bindows and the domestic JSVM framework, By applying these JS frameworks to our project, we can release the programmer from the complex JS application of design and writing, turn the focus to the functional requirements rather than the implementation details, thus improving the development speed of the project.
jquery is another excellent JavaScript framework after prototype. It was created by John Resig in early 2006 to help simplify JavaScript™ and Ajax programming. Someone uses such a metaphor to compare prototype and jquery:prototype like Java, and jquery is like Ruby. It's a simple, fast, flexible JavaScript framework that lets you simply manipulate documents, handle events, implement special effects, and add Ajax interactions to your Web pages.
It has some of the following characteristics:
Code concise, semantic understandable, fast learning, rich in documentation.
jquery is a lightweight script with very small code and the latest version of the JavaScript package is only about 20K.
jquery supports CSS1-CSS3, as well as basic XPath.
jquery is Cross-browser, and it supports browsers including IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+.
You can easily extend other features for jquery.
Can the JS code and HTML code completely separate, easy to code and maintenance and modification.
Plug-ins are rich, in addition to jquery itself with some special effects, you can implement more functions through plug-ins, such as form verification, tab navigation, drag and drop effects, table sorting, DataGrid, tree menu, image effects and Ajax upload.
jquery design will change the way you write JavaScript code, reduce the complexity of your learning to use JS to manipulate Web pages, improve the efficiency of the Web JS development, whether for JS beginners or senior experts, jquery will be your first choice.
jquery is suitable for designers, developers, and those who are good, and is also suitable for commercial development, and it can be said that jquery is suitable for any JavaScript application and can be used in different Web applications.
jquery Code
/* New window Open Link: JQuery filter attr * Disable mouse Popup Right-click menu: Dom ContextMenu * back to top of page: Dom Scrollto * Dynamic replacement CSS style sheet: JQuery filter Element at Tribute * Adjust page font size: Css html.css parsefloat//Determine DOM load completion $ (document). Ready (function () {/* Link's href attribute opens in new window with HTTP
Link//^ filter, properties: Start with a specific string $ ("A[href ^= ' http ')"). attr ("target", "_blank"); /* Prohibit the right mouse button///dom ContextMenu is the right mouse button menu $ (document). Bind ("ContextMenu", function (e) {alert ("No right-clicking!")
);
Do not execute downward, that is to say, the right button menu does not come out return false;
});
* * Back to the top of the page * *//id= the element's Click event triggers $ (' #top '). Click (function () {//back to top of page $ (document). Scrollto (0, 500);
}); ///////////////////////////////////////////////////("A.cssswap"). Click (function () {$ (' link[rel=stylesheet])
R ("href", $ (this). attr ("rel"));
});
/* page font size zoom in, zoom out, restore//Get font size, define font-size var originalfontsize = $ ("HTML") under HTML tags. css ("font-size");
Restores the default font size $ (". Resetfont"). Click (function () {$ ("html"). CSS ("Font-size", originalfontsize); //javascript does not perform a return false;
}); To enlarge the font, the class of an element is defined as Increasefont $ (". Increasefont"). Click (function () {//Get current font size suffix px,pt,pc var currentfontsiz
E = $ ("html"). CSS ("font-size");
Gets the current font size, parsefloat () to float type to remove the suffix var currentfontsizenumber = parsefloat (currentfontsize);
The newly defined font size var newfontsize = Currentfontsizenumber * 1.1;
Override style sheet $ ("HTML"). CSS ("Font-size", newfontsize);
JavaScript does not carry down return false;
}); Reduces the font, and the class of an element is defined as Decreasefont $ (". Decreasefont"). Click (function () {//Get current font size suffix px,pt,pc var currentfontsiz
E = $ ("html"). CSS ("font-size");
Gets the current font size, parsefloat () to float type to remove the suffix var currentfontsizenumber = parsefloat (currentfontsize);
Redefine font size var newfontsize = currentfontsizenumber * 0.9;
Override style sheet $ ("HTML"). CSS ("Font-size", newfontsize);
JavaScript does not carry down return false;
}); });
HTML code:
<! DOCTYPE html> <meta charset= "Utf-8"/>
OK, the above is a small set to share the jquery skills, I hope you like.