JQuery first lecture

Source: Internet
Author: User

The importance of JQuery should be self-evident for a coder. I was asked how many times when I was applying for JQuery, and how many times I vomited blood when I was writing scripts because of browser incompatibility; the number of times the hand cramps are written because a script is required for a simple effect. After JQuery appeared, many problems were easily solved.
Every time we learn one thing, we always like to understand its history. Since we started from scratch, we can also learn a little bit about its history.
JQuery was created by John Resig, an American who has attracted many javascript experts from around the world to join the team, including Jörn Zaefferer from Germany and Stefan Petre from Romania.
JQuery is another excellent Javascr into pt framework after prototype. Its purpose is to write less, do more, write less code, and do more.
It is a lightweight js Library (only 21 k after compression), which is not suitable for other js libraries. It is compatible with CSS3 and various browsers (IE 6.0 +, FF 1.5 +, safari 2.0 +, Opera 9.0 + ).
JQuery is a fast and concise javaScript library that allows you to easily process HTML documents, events, animation effects, and provide AJAX interaction for websites.
Another major advantage of jQuery is its comprehensive documentation and detailed description of various applications. There are also many mature plug-ins to choose from.
JQuery can ensure that the user's html page is separated from the code and html content. That is to say, you don't need to insert a bunch of JavaScript code in the html to call the command. You just need to define the id.
Next we will start our first DEMO, which will be explained based on the DEMO. The first lecture is a simple introduction, rather than an in-depth explanation and analysis. If you need to provide source code, you can join the group: 34979719 Copy codeThe Code is as follows: <% @ Page Language = "C #" AutoEventWireup = "true" CodeBehind = "Default. aspx. cs" Inherits = "JQuery_1. _ Default" %>
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head runat = "server">
<Title> </title>
<Script type = "text/javascript" src = "JS/jquery-1.3.2.min.js"> </script>
<Script type = "text/javascript">
Alert ("hello world ");
</Script>
<Script type = "text/javascript">
$ (Document). ready (function (){
Alert ("hello world again ");
});
</Script>
<Script type = "text/javascript">
Function f1 (){
Alert ("hello world again ");}
</Script>
</Head>
<Body onload = "f1 ();">
<Form id = "form1" runat = "server">
<Div>
</Div>
</Form>
</Body>
</Html>

From the preceding DEMO1, we can see that to use JQuery, you must first reference A JQuery package.

Compressed: http://code.google.com/p/jqueryjs/downloads/detail? Name = jquery-1.3.2.min.js & downloadBtn = <SPAN> Download <% 2 FSPAN>

Unzipped version: http://code.google.com/p/jqueryjs/downloads/detail? Name = jquery-1.3.2.js

The above version of the downloaded JQuery package is 1.3.2, and the latest JQuery package has reached 1.42. If you want to try it, you can download it yourself. At present, we are mainly talking about Version 1.3.2.

After the JQuery package is introduced, we can start to write our script program. From the running effect of the example, the page will pop up after loading: "hello world", "hello world again", and "hello world again" have the same effect. The first and third are the traditional JS, and the second is the JQuery program. If you remove this line from <script type = "text/javascript" src = "JS/jquery-1.3.2.min.js"> </script>, the prompt is: $ is not defined.

$ Is an alias for jQuery "class". Therefore, $ () constructs a new jQuery object ). $ () Is the selector. $ (document) constructs a document Object of JQuery. The ready () function is a method of this jQuery object. After DOM is loaded, it starts to execute the event of this method. In the DEMO, the alert method provided by this function is executed when this event is triggered. All JQuery methods are enclosed in a pair of parentheses (), followed by a plus sign.

I want to talk so much about it today. I hope that you will understand it. I also hope that you will discuss it and correct it in a timely manner. Next we will talk about JQuery's selector and how JQuery gets control values.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.