Quick Start With jquery: The difference between writing jquery and writing JS directly

To use jquery, you must first Add a reference to the jquery Library at the beginning of the HTML code, for example:

<Script language = "JavaScript" src = "/JS/jquery. Min. js"> </SCRIPT>

Library files can be stored locally or directly using the CDN of well-known companies. The advantage is that the CDN of these large companies is quite popular, before a user visits your website, it is likely that the website has been cached in the browser when accessing other websites, which can speed up website opening. Another advantage is obvious, saving the website traffic bandwidth.

 

The differences between jquery code writing and native JavaScript writing are as follows:

1 positioning Element
JS
Document. getelementbyid ("ABC ")

Jquery
$ ("# ABC") locate by ID
$ (". ABC") locates through class
$ ("Div") locate by tag

It should be noted that the result returned by JS is this element, and the result returned by jquery is a JS object. In the following example, we assume that the element ABC has been located.

2. Change the Element Content
JS
ABC. innerhtml = "test ";
Jquery
Abc.html ("test ");

3. Show Hidden elements
JS
ABC. style. Display = "NONE ";
ABC. style. Display = "Block ";

Jquery
ABC. Hide ();
ABC. Show ();

ABC. Toggle ();
// Switch between display and hide (updated on 2012.4.21)

4. Focus

JS and jquery are the same, both of which are abc. Focus ();

5. assign values to the form
JS
ABC. value = "test ";
Jquery
ABC. Val ("test ");

6. Obtain the form value.
JS
Alert (ABC. value );
Jquery
Alert (ABC. Val ());

7. The setting element is unavailable.
JS
ABC. Disabled = true;
Jquery
ABC. ATTR ("disabled", true );

8. Modify element styles
JS
ABC. style. fontsize = size;
Jquery
Abc.css ('font-size', 20 );

JS
ABC. classname = "test ";
Jquery
ABC. removeclass ();
ABC. addclass ("test ");

9 Ajax
JS
Create an object by yourself, and handle browser compatibility issues by yourself. Skip the table.
Jquery
$. Get ("ABC. php? A = 1 & B = 2 ", recall );
Postvalue = "A = B & C = D & abc= 123 ";
$. Post ("ABC. php", postvalue, recall );

Function recall (result ){
Alert (result );
// If JSON is returned, the processing is as follows:
// Result = eval ('+ Result + ')');
// Alert (result );
}

10. Check whether the check box is selected.
Jquery
If (ABC. ATTR ("checked") = "checked ")