jquery1.4 tutorial A convenient setup function _jquery

Source: Internet
Author: User
Convenient setup functions
Most set value pairs of jquery1.4 methods can set the second parameter to be a callback function. For example:. CSS (),. attr (),. Val (),. html (),. Text ().
This is a very abstract view of the example http://demo.jb51.net/js/jquery1.4/jquery_1.htm
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <ptml xmlns=" http://www.w3.org/1999/xhtml "> <pead> <meta http-equiv=" Content-type "content=" text/html; charset=gb2312 "/> <title> convenient setting function </title> <script type=" Text/javascript "src=" http:// Ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js "></script> <link href=" Basic.css "rel=" Stylesheet "type=" Text/css "/> <link href=" demo.css "rel=" stylesheet "type=" Text/css "/> <script type=" text /javascript "> $ (Function () {$ (" #btn1 "). Click (function () {$ (' #a1 '). HTML (function (i,html) {RE Turn Html.replace (/. /g, '! has been replaced '); }); }) $ ("#btn2"). Click (function () {$ (' #a1 '). attr ("title", Function (i,title) {return title + "(Has been Change) "; }); }) </script> </pead> <body> <p class= "LEFT_H1" > Improved one: Most set value pairs of jquery1.4 methods can set the second parameter to be a callback function. For example:. CSS (),. attr (),. Val (),. html (),. Text (). </p> <p></p> <p> Look below the demo</p> <p> this is a link. </p> <p> now use the callback function to replace the text directly in the join. The previous approach was to take the htnl of a and then use a regular match and finally replace it. </p> <p>1.4 One step, look at the code:</p> <p><code> $ (' #a1 '). HTML (function (i,html) { Return Html.replace (/. /g, '! has been replaced '); }); </code> <input name= "btn1" id= "btn1" type= "button" value= "point this replacement"/> You will find that convergence. " "Replaced by"! has been replaced. " </p> <p> is it more convenient than before? </p> <p> also applies to other set value pairs, such as attr (), you can try to change the second parameter into a function to see. </p> <p> The title attribute of this replacement link:</p> <p><code> $ (' #a1 '). attr ("title", Function (I,title) { Return title + "(has been replaced)"; }); </code></p> <p> <input name= "btn2" id= "btn2" type= "button" value= "point this replacement"/> </p> </bod Y> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]

The code you want to replace text on an object before 1.4 is as follows:
Copy Code code as follows:

<a href= "" id= "A1" title= "Test" > this is a link. </a>
var _html = $ (' #a1 '). html ();
var _newhtml = Html.replace (/. /g, '! has been replaced ');
$ (' #a1 '). HTML (_newhtml);

And 1.4 is just like this:
Copy Code code as follows:

$ (' #a1 '). HTML (function (i,html) {return Html.replace (/. /g, '! has been replaced ');

A line of code to fix! It is important to traverse multiple objects and handle them separately.
Take a look at the two parameters of the callback function:
The first parameter is an indexed value and is useful when you are handling the traversal object separately
The second parameter is the old HTML value.
This callback function must have a return value!
This approach, not only can be applied to HTML (), the other set the value of the method is basically OK. The detailed list is as follows:
. CSS (),. attr (),. Val (),. Text (),. append (),. prepend (),. before (), after (),. ReplaceWith (),. Wrap (),. Set (),. addclass (),. Removeclass (),. Toggleclass ()
The next issue will focus on jquery1.4 improvements in Ajax.

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.