Solution to $ conflict after jQuery is loaded

Source: Internet
Author: User

Currently, few developers write documents manually in the development of the website. the getElementById () is enough, so it cannot be exhausted. You really should not say that getElementById is really hard to write. The letters are quite case-sensitive and may be wrong at first glance. Therefore, it is common to use $ to implement document. getElemetnById.
Copy codeThe Code is as follows:
Function $ (){
Var elements = new Array ();
For (var I = 0; I <arguments. length; I ++ ){
Var element = arguments [I];
If (typeof element = 'string ')
Element = document. getElementById (element );
If (arguments. length = 1)
Return element;
Elements. push (element );
}
Return elements;
}

Microsoft's asp.net ajax client framework also has code similar to $ get.
Copy codeThe Code is as follows:
Var $ get = Sys. UI. DomElement. getElementById = function Sys $ UI $ DomElement $ getElementById (id, element ){
/// <Param name = "id" type = "String"> </param> 4.5.
/// <Param name = "element" domElement = "true" optional = "true" mayBeNull = "true"> </param> 6.7.
/// <Returns domElement = "true" mayBeNull = "true"> </returns> 8.9.
Var e = Function. _ validateParams (arguments ,[
{Name: "id", type: String },
{Name: "element", mayBeNull: true, domElement: true, optional: true}
]);
If (e) throw e;
If (! Element) return document. getElementById (id );
. If (element. getElementById) return element. getElementById (id );
// Implementation for browsers that don't have getElementById on elements: 28.29.
Var nodeQueue = [];
Var childNodes = element. childNodes;
For (var I = 0; I <childNodes. length; I ++ ){
Var node = childNodes [I];
If (node. nodeType = 1 ){
NodeQueue [nodeQueue. length] = node;
}
}
While (nodeQueue. length ){
Node = nodeQueue. shift ();
If (node. id = id ){
Return node;
}
ChildNodes = node. childNodes;
For (I = 0; I <childNodes. length; I ++ ){
Node = childNodes [I];
If (node. nodeType = 1 ){
NodeQueue [nodeQueue. length] = node;
}
}
}
Return null;
}

Because jQuery is simple, elegant, and more important to be promoted by Microsoft, it is natural and necessary to introduce jQuery in the project. jQuery uses the $ function to return a jQuery object, that is, $ = jQuery. After the introduction of jQuery, there will inevitably be conflicts with the $ symbol problem. Therefore, there are two main ideas to solve this problem.
1. Use jQuery. noConfict () to make $ equal to jQuery. The code is $ = jQuery. noConflict (). A few things need to be done in this way
1. Add $ = jQuery. noConflict (), jQuery VS smart prompt file (jQueryXXX-vsdoc. js) is also the final window. jQuery = window. $ = jQuery; also changed to window. jQuery = window. $ = jQuery; all right.
2. Add $ = jQuery. noConflict () at the beginning of jQuery-based plug-ins and extension files, and add $ = jQuery. noConflict (); at the end ();.
3. Add jQuery at the top of the original $ implementation file. noConflict () means to give $ "power" to other js files of our own, and then add $ = jQuery at the end of the file. noConflict ().
4. Pay attention to the sequence when introducing js to the page. Put jQuery-related files in front and jQuery-Irrelevant files in back.
After this is done, $ still indicates the previous meaning, while jQuery can be used directly with jQuery or $.
Advantage: you only need to modify a few files to achieve the goal.
Disadvantage: $ is not easy to use. You need to perform the operation once in step 2 when introducing the jQuery plug-in later.

Ii. Replace the original $. After consideration, I will adopt the second method, because jQuery will be widely used in future projects, it is awkward to use $ or jQuery to write code. Considering the compatibility of asp.net ajax, replace the original $ with $ get. It is not difficult to replace it with Visual Studio.


But you still need some further steps.
1. Replace $ with $ ("with $ (", then $ get ('with $ (', and then $ get with $.
2. Use the VSS check-out prompt feature to confirm a file one by one (if an error occurs, it is not a trivial matter ). Finally, some minor problems were solved with the assistance of colleagues.
3. The replacement feature of Visual Studio is really Qiankun, and there are quite a few Replace in Files in the following.

On the Use check box, do not select Regular expressions, because $ indicates End of Line clearly displayed on the right. Look In, of course, select the Current Project, of course, after the button on the right is pressed, you can select multiple directories to box the reverse question. This is never used before. Look at these file types can select some special file types to narrow down the scope.

Related Article

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.