jquery use attention points and recommendations

Source: Internet
Author: User
Tags http request json prev

jquery is a very good JS framework, I believe most people have used, and are very familiar with its application, it is very simple to use, the basic operation is needless to say. Here is not a list of jquery API, summed up the points to be noted, are usually easy to make mistakes in the place, sharing, feeling there are more valuable, the specific contents are as follows:

One, Ajax-Related:

Copy Code

$.ajax ({

Type: "Post",

URL: "Xxx.action",

Data: ' Name=john&location=china '

Data: {Name:john, Location:china},

DataType: "JSON",

Async:false,

Success:function (data) {

}

});

Copy Code

The usage difference of 1.data two kinds of parameters

① when the value of a parameter is a special case (the value itself contains the character ' & '): For example, NAME=JOHN&JOHN2, data becomes ' Name=john&john2&location=china ', This can result in unpredictable results when the data is uploaded to the background.

② under normal circumstances, that is, the value of the parameter does not have a special character ' & ', and sometimes the "parameter can not receive or incomplete" situation, the specific reasons I also know, this really experienced, the code is no problem, to the background there is a parameter is not passed, So the conclusion is to use the second way of writing better: data: {Name:john, Location:china}, has never been a loss of parameters, but also strong fault tolerance.

2.async Sync mode: TRUE or False?

① If you need to wait for the results of Ajax execution, use false, or you will never get the correct result. The reason is simple, if not false, the code will go directly down, then the value of Ajax has not returned, the program did not follow the order of the imagination, the results can be imagined.

② If you do not need to wait for Ajax execution results best use true, because the "synchronized Way" (Async=false) when the page will be "suspended animation" state, the user appears to be "stuck", especially the number of suspended animation too much, experience poor (Ajax do not abuse, The work that can be done in the background is done in the background, especially some initialization work.

3.dataType: Generally our return value type is "JSON", this must be written, and correctly written, (even if the background specified the HTTP packet MIME type) has made a mistake, the return value incorrectly written "HTML", the result is always not get the value you want, and finally will return the value of a print, The discovery is a lot of information that contains HTTP information, as if it were a page HTML code, and it occurred to me that Ajax was an HTTP request.

4. Summarize, to develop good habits, no matter how simple your Ajax, the 5 most basic parameters are brought, and according to their own situation to write the parameter values correctly.

Second, small knowledge:

The 1.jquery selector always returns the array of numbers, also because of this, the element selected by ID does not exist and will not report an error, but we can not write the error because it is not to write code, if you are unsure of the existence of elements, it is best to do "not NULL" judgment, Example:

if ($ ("#btn1"). Length > 0) {

Body Code

}

2. When there are multiple IDs or name-like elements on the page, what if? Usually through the "relative path" to take, because if you want to take a value, always by some "event" trigger, if clicked on a button, then take this button as the starting point to look up or look down, commonly used functions:

Parent: Take the parents element

Child: Taking the Children node element

Prev: Take sibling node (sibling) the previous

Next: The previous of a sibling node (sibling)

An example: Shopping cart Display page, a table of many groups of goods, each group can be settled separately, that is, there is a settlement "button", and this group of goods a certain position has a hidden element, their name is the same, then you can take the value:

$ (this). Parents ("tr"). Prev (). Find ("TD"). FIND ("Input[name= ' Activecode ')"). Val ();

The meaning is to find the value of the element named Activecode from a column in the front line of the checkout button, where the "TD" can be added with EQ (index value) if it can be determined.

3. Take an element without an ID (sometimes some elements are not ID, often are lists, if their own bad plus or do not want to add ID, or can not add) I have encountered a situation where the page has a set of Li, their values are derived from the definition of a good set a, some of the data in hand A1 also from A, The data in the A1 can also appear in the page Li, or it may not. The demand is the value in the A1, Li set also appears in the same time to do some style adjustment, Li in any element has no ID, only the outside UL has ID. In this "extreme condition", there are

The final approach is to loop the Li and then judge by the value equality. (also said that as long as the encounter value, there must be a loop, code written to be very bloated, but there is no way, it can only)

$ (Li collection). each (function () {

//

Body Code

});

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.